Redux状态被Reducer默认状态覆盖问题求助

兄弟，我太懂这种明明API返回正常、Redux也更新了但转眼就被打回原形的崩溃感了！咱们一步步来揪出这个问题：

1. 先查Reducer的default分支逻辑 #

这是最常见的坑！很多人会在Reducer里只处理了成功请求的action，但遇到其他不匹配的action时，直接返回了初始默认状态而不是当前的state。

比如错误示例：

const courseReducer = (state = initialState, action) => {
  switch(action.type) {
    case 'FETCH_COURSES_SUCCESS':
      return {...state, courses: action.payload};
    // 这里犯了致命错误！
    default:
      return initialState; // 应该返回state，而不是初始值！
  }
}

如果default分支返回initialState，任何未被匹配的action（比如组件触发的其他小action、甚至Redux内部的初始化action）都会把你的状态直接重置。赶紧改成return state试试！

2. 排查组件里的重复触发逻辑 #

看看你的ShowCoursesStudentParent组件：

• 有没有在componentDidMount或者其他生命周期钩子（比如函数组件的useEffect）里，不小心同时触发了请求数据和重置状态的action？
• 组件是不是被重复挂载/卸载了？比如父组件的key变化、路由反复切换，导致组件重新渲染时，又执行了初始化逻辑覆盖了现有状态？

3. 用Redux DevTools追踪action顺序 #

打开Redux DevTools，盯着action的执行流：

• 确认FETCH_COURSES_SUCCESS执行后，状态确实更新了
• 看看紧接着有没有一个未知的action被触发，刚好命中了Reducer的default分支，把状态打回初始值
• 如果有，顺着这个action找到它的触发源，大概率是某个组件或中间件的误操作

4. 确认状态更新的不可变性（虽然概率低但也排查下） #

虽然你说状态被正确填充过，但还是要确认Reducer里的状态更新是不是符合Redux的不可变性要求：

• 别直接修改原state，比如state.courses = action.payload这种写法是错的
• 正确写法应该是返回新对象：return {...state, courses: [...action.payload]}

内容的提问来源于stack exchange，提问作者amliving