ReactNative+Redux重置状态触发状态突变报错及APK启动卡顿问题

核心问题1：Redux状态突变检测错误 #

你遇到的状态突变错误，根源在于两个点：

• 重置状态时直接返回initialState引用：initialState.data是对象类型，当你通过setRecievedData赋值后，这个对象可能被外部（比如组件）意外修改，重置时返回同一个引用会触发Redux的突变检测。
• setRecievedData传入的data可能未做深拷贝：如果传入的data包含嵌套对象/数组，直接赋值会导致Redux状态和外部数据共享引用，后续修改外部数据会污染Redux状态。

核心问题2：APK打包后卡闪屏 #

ExpoGo开发模式对状态突变有一定容错，但生产打包后Redux的严格模式会触发错误，导致应用在闪屏页崩溃，本质还是状态突变未被修复。

具体修复步骤 #

1. 修复Reducer的重置逻辑 #

不要直接返回initialState，而是返回一个全新的对象，确保状态引用完全独立：

const recievedDataReducer = (state = initialState, action) => {
  switch(action.type) {
    case SET_RECIEVED_DATA:
      return {
        ...state,
        data: action.payload,
      };
    case RESET_RECIEVED_DATA:
      // 返回新对象，而非initialState的引用
      return { data: {} };
    default:
      return state; // 不需要额外解构，直接返回原state即可
  }
}

2. 修正无用的Action Payload #

resetRecievedData的payload是[]但Reducer未使用，直接移除冗余代码：

export const resetRecievedData = () => ({
  type: RESET_RECIEVED_DATA
})

3. 确保状态更新时的不可变性 #

调用setRecievedData时，必须传入数据的深拷贝，避免外部引用污染Redux状态：

• 简单场景可以用JSON.parse(JSON.stringify(data))快速深拷贝：

const copiedData = JSON.parse(JSON.stringify(yourOriginalData));
dispatch(setRecievedData(copiedData));

• 复杂嵌套结构推荐手动解构嵌套对象，或者使用Immer库简化不可变更新：

// 手动解构示例（针对报错路径的数组）
const copiedData = {
  ...yourOriginalData,
  stem: {
    ...yourOriginalData.stem,
    ControlMeasurementDefinition: [...yourOriginalData.stem.ControlMeasurementDefinition]
  }
};
dispatch(setRecievedData(copiedData));

4. 检查组件中的状态修改 #

确保所有状态更新都通过Redux Action触发，禁止在组件中直接修改Redux状态的属性：

// ❌ 错误：直接修改状态
const data = useSelector(state => state.recievedData.data);
data.stem.ControlMeasurementDefinition.push(newItem);

// ✅ 正确：通过Action更新
dispatch(setRecievedData(updatedCopiedData));

验证修复 #

修复后重新打包APK，状态突变错误会消失，闪屏页卡住的问题也会解决。可以用Redux DevTools监控状态变化，确认每次重置和更新都是全新的引用。

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