我正在嘗試使用 Redux 獲取“所有帖子”。我應該得到一個空陣列,但相反,我變得不確定。這是我的減速器:
export default (posts = [], action) => {
switch ((action.type)) {
case "FETCH_ALL":
return action.payload;
case "CREATE":
return posts;
default:
return posts;
}
};
行動
export const getPosts = () => async (dispatch) => {
try {
const { data } = await api.fetchPosts();
dispatch({ type: "FETCH_ALL", payload: data });
} catch (error) {
console.log(error.message)
}
};
Posts.js 組件
import { useSelector } from "react-redux";
import Post from "./Post/Post";
import useStyles from "./styles";
const Posts = () => {
const posts = useSelector((state)=>state.posts)
console.log(posts)
const classes = useStyles();
return (
<>
<h1>Posts</h1>
<Post />
</>
);
};
export default Posts;
uj5u.com熱心網友回復:
根據你的 reducer,你的整個狀態是一個 posts 陣列而不是像 { posts: [ ] } 這樣的狀態物件。因此,在您的選擇器中,您可以簡單地回傳 Posts 組件中的狀態。
const posts = useSelector((state)=>state);
uj5u.com熱心網友回復:
我相信您需要更改 reducer 檔案中的一行。您需要將 action.payload 分配給帖子,然后您才能訪問它
export default (posts = [], action) => {
switch ((action.type)) {
case "FETCH_ALL":
return {posts: action.payload};
case "CREATE":
return posts;
default:
return posts;
}
};
uj5u.com熱心網友回復:
- 首先,
switch ((action.type))應該是switch (action.type) - 然后,您應該檢查
datafrom api 是否正確回傳 - 最后,檢查你的 redux 狀態物件和你的選擇器
posts
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/534629.html
上一篇:在mouseenter上替換一個字母,在mouseleave上改回
下一篇:JS/VueJS一鍵運行兩個函式
