redux 相关问题

我刚刚开始学习redux< redux-toolkit and ran into the problem that my stat from the "Pastime" reducer always returns the initial value, although it works correctly in another

reactjs redux redux-toolkit

回答 1 投票 0

如何向 useSelector 传递附加参数

我正在从组件成功调用 useSelector，该组件从 id 派生出产品名称。常量产品ID = 25; // 任何 const 产品名称 = useSelector( （状态）=> 状态.dashbo...

reactjs redux react-redux

回答 4 投票 0

我无法返回（获取）前面的“Authorization”标头/授权字段返回未定义 - React - Redux -

登录我的应用程序时，标头内的授权返回未定义在此输入图像描述但是，当在“网络”中的开发人员工具中检查时，令牌就在那里......

java reactjs redux react-redux cors

回答 1 投票 0

类型“(Person | undefined)[]”不可分配给类型“People”

从减速器返回更新状态时，我收到此打字稿错误：类型“(Person | undefined)[]”不可分配给类型“People” 减速器.ts：导出类型 Person = { id：字符串；名称：

reactjs typescript redux redux-toolkit

回答 1 投票 0

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; 请检查工作示例。

reactjs typescript redux redux-toolkit

回答 1 投票 0

redux 相关问题

最新问题