reactjs 相关问题

向 formik 表单字段自定义组件添加类型导致错误：类型“T[keyof T]”不可分配给类型“string”

我是 TypeScript 新手，并尝试在过去的项目中实现它作为练习。 我在尝试向 formik 表单字段自定义组件添加类型时遇到了死胡同，其中出现错误 Type 'T[ke...

MUI TextField 自动完成背景颜色

我有一个使用 React.js 和 Material UI 构建的应用程序，并且对自动完成字段的背景颜色有问题。 它添加了不必要的白色背景。 但是当我手动添加文本时，...

由于对ag-grid中的其他列进行排序，如何禁用对序列号列的排序效果

我想要一个固定的序列无列，而不管其他列上的排序如何。目前，当我对其他列进行排序时，序列号也没有列也被交换，从而混淆了序列号没有列的顺序...

无法连接react到后端node js服务器express

我是初学者，我正在尝试了解React js的PORT和服务器端连接。 我一直在阅读一篇文章并尝试将 React JS 连接到 Node Express。 React 端口是 http://loc...

如何使用顺风CSS使设计响应于两种不同的背景

我正在从 Figma 设计中获取这张图片，我需要映射此设计以与 Tailwind CSS 像素完美 100% 做出反应。 Macbook Pro 16 英寸宽度为 1728px，但我需要将内容中心设置为...

js 代码在使用 tailwind 进行 React 时不起作用

我正在尝试使用useState制作一个toogle侧边栏，但是在className内部我无法同时实现js代码和tailwind，我只能添加js代码或我的tailwind代码，正如你在我的代码中看到的那样...

Pigment CSS 包装器

我正在尝试围绕 @pigment-css/react 的样式函数创建包装函数。 我不会打扰您有关我的包装器的详细信息，因此我将提供最简单的包装器，只是为了

React Redux Toolkit 访问对象数组内的值

组件： const postState = useSelector((state: RootState) => state.postsSlice.posts); { postState?.map((post) => { 返回 （ 成分： const postState = useSelector((state: RootState) => state.postsSlice.posts); { postState?.map((post) => { return ( <PostCard key={post.id} title={post.title} description={post.body} user={post.user} voteCount={post.upvotes - post.downvotes} onClick={() => navigate(`/posts/${subredditId}/post/${post.id}`)} /> ); }); } 我正在使用 React TypeScript 开发一个 Reddit 克隆项目。我将来自 api 的数据作为以下类型的对象数组： export type Posts = Post[]; export type Post = { id: string; title: string; user: string; body: string; upvotes: number; downvotes: number; }; 然后我将数据存储在 redux 工具包中，如下所示： type PostsArray = { posts: Array<Post>; }; const initialState: PostsArray = { posts: [] }; const PostsSlice = createSlice({ name: "PostsSlice", initialState: initialState, reducers: { setPostsData(state, action: PayloadAction<Array<Post>>) { state.posts = action.payload; }, }, }); export const { setPostsData } = PostsSlice.actions; export default PostsSlice.reducer; 当我映射组件中的对象时，我通过从赞成票中减去反对票来显示 Reddit 投票计数。 我想做的是能够对不同的帖子投赞成票和反对票，并将投票存储在 redux 中。我考虑过增加赞成票的调度和增加反对票的调度。但我不知道该怎么做。我不知道如何获得 redux 中特定帖子的点赞。有什么想法吗？ 对于这种情况，您可以添加一个减速器来获取帖子 ID 并使用操作负载上传递的值更新它，如下所示： 减速机 const PostSlice = createSlice({ name: "PostSlice", initialState: initialState, reducers: { setPostsData(state, action: PayloadAction<Array<Post>>) { state.posts = action.payload; }, // reducer to change the vote count updateVoteCount( state, // in the vote payload you can use an enumerate // if you want to avoid typos action: PayloadAction<{ id: string; vote: string }> ) { // find the post by id const post = state.posts.find((post) => post.id === action.payload.id); if (!post) return; if (action.payload.vote === "up") { // update the vote depending on payload vote parameter post.upvotes += 1; } if (action.payload.vote === "down") { post.downvotes += 1; } } } }); 明信片 由于您没有提供您的代码PostCard我做了一个简单的例子只是为了向您展示： const PostCard = (props: PostCardProps) => { const dispatch = useDispatch(); return ( <div> <h2>{props.title}</h2> <p>{props.description}</p> <p>{props.user}</p> <p>{props.voteCount}</p> <div> <button onClick={() => //Dispatch the action with vote "up" dispatch(updateVoteCount({ id: props.id, vote: "up" })) } > Up vote </button> <button onClick={() => // dispatch with vote "down" dispatch(updateVoteCount({ id: props.id, vote: "down" })) } > Down vote </button> </div> </div> ); }; export default PostCard; 请检查工作示例。

cookies是如何设置的？ - React.js 和 Node.js

说明： 我正在为我的 React 应用程序使用 Oauth 2.0。当我获得用户的谷歌登录同意时，重定向网址是“http://localhost:3000/google/auth”，我在其中处理获取访问令牌，

React useState 弹出窗口正在打开，但我无法关闭它

我正在学习电子商务网站的初学者教程，在制作登录弹出窗口时，我为其制作了一个组件并将其安装在导航栏组件上。当您点击时，它将打开弹出窗口...

使用MUI DataGrid，如何在Change时更新单元格状态？

我需要什么：我正在使用 MUI DataGrid > 5。我需要单元格中填充的数据自动更改状态（onChange）。此时此刻，我有一个 useEffect 正在监听这些 c...

Typescript 中的 Intersection Observer 在 useRef 中抛出错误

我这里有一个运行完美的文本动画。我现在要添加的是一个 Intersection Observer，这样动画只有在我向下滚动到 Box 时才开始。 所以我做了什么来实现......

由于（不存在）导入react-refresh而导致编译错误

我们目前正在开发一个小型应用程序，它只渲染一个外部 React 组件（因为安装了 npm，所以是外部组件）。这个应用程序的目的是获取一些 JSON 配置并传递...

React State 未从 prop 初始化

我正在使用 React 和 TypeScript。我是 React 新手，我不确定如何确保子组件根据传递给它的 prop 正确设置状态。 我正在传递一个来自父母的对象

React id swiper 在 React 18 中不起作用

我正在使用带有 Swiper 版本 ^11.1.3 的 React 18 和带有版本 ^4.0.0 的 React-id-swiper。当我尝试使用它时，我收到此错误。 “

如何在文本输入中添加图标标签

这里我创建了一个div类，在div类下添加一个img标签，用于显示个人资料图片。之后我们可以看到带有一些 css 的 。在此之外 h...

使用 React 测试库测试 React 查询组件时出现“No QueryClient set, use QueryClientProvider to set one”

我在测试使用反应查询自定义挂钩的组件时收到此错误： “未设置 QueryClient，请使用 QueryClientProvider 设置一个” 这是我的钩子： 导出默认值 () => { ...

从 React 组件创建纯 Web 组件

我正在尝试从 React 组件构建 Web 组件，一切正常，但有两个问题我正在尝试解决： 有没有办法将此类 Web 组件转换为纯 Web 组件...

动态绑定依赖于父列表项更改的选择列表在react js和node js中不起作用

我有2个关于sbu列表和部门列表的选择列表。我想根据 sbu 列表项的 onChange 事件选择值更新部门列表。但根据我的代码，它有时只能工作......

我正在我的 Vite React 应用程序中设置测试，但出现以下错误

无法从 C:\Users\ZN\Documents\dipish\React ite-project ite.config.js 加载配置 ────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────── ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯未处理的错误⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ ⎯...