为何useEffect无法更新组件？PostWidget不显示问题排查

1. Redux状态选择路径错误 #

在PostsWidget.jsx中，当前获取posts状态的选择器路径错误：

const posts = useSelector((state) => state.posts);

由于你的authSlice命名为auth，对应的store状态会挂载在state.auth节点下，正确的选择器应该是：

const posts = useSelector((state) => state.auth.posts);

2. setPosts Reducer处理Payload错误 #

在AuthSlice.js的setPosts reducer中，错误地尝试从action.payload.posts取值：

setPosts: (state, action) => {
  state.posts = action.payload.posts;
},

但你从API获取的res.data本身就是posts数组，dispatch时传递的是这个数组，因此action.payload直接对应posts数组，无需再取posts属性。修改为：

setPosts: (state, action) => {
  state.posts = action.payload;
},

可选优化点 #

• 给useEffect添加依赖项，确保isProfile或userId变化时重新请求数据：

useEffect(() => {
  if (isProfile) {
    getUserPosts();
  } else {
    getPosts();
  }
}, [isProfile, userId]);

• 给posts设置默认空数组，避免初始状态下map报错：

const posts = useSelector((state) => state.auth.posts) || [];

内容的提问来源于stack exchange，提问作者Emdadudl Haque Apu