React useReducer初始参数rerender时不更新问题求助

• 核心问题：useReducer的第二个参数是组件首次挂载时的初始state，仅会在组件第一次渲染时被读取。后续父组件传入的data发生变化时，useReducer不会自动将新的data同步到现有state中，这就是为什么首次选择后state不再更新。
• 修复步骤：
  1. 新增一个监听data变化的useEffect，当data更新时手动触发dispatch：

     useEffect(() => {
       dispatch({ type: 'SYNC_DATA', payload: data });
     }, [data, dispatch]);
     

  2. 在reducer函数中添加对应action的处理逻辑：

     function reducer(state, action) {
       switch (action.type) {
         case 'SYNC_DATA':
           return action.payload;
         // 保留原有的其他action处理逻辑
         default:
           return state;
       }
     }
     

• 可选简化方案：如果你的场景不需要复杂的state操作逻辑，也可以直接用useState配合useEffect来同步父组件数据，代码会更简洁：

  const [state, setState] = useState(data);
  useEffect(() => {
    setState(data);
  }, [data]);
  

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