React Native Immutable数据结构报错：push方法无法调用问题排查

开发者阿泽

2026-5-28

解决React Native Reducer中Immutable数据操作错误的问题

嘿，这个问题我之前也碰到过！核心原因是你违反了状态管理里的不可变数据原则，咱们一步步拆解问题和解决方法：

你的错误点

你这段代码里的let am_selectedTrainerMovements = state.selectedTrainerMovements;只是把原数组的引用赋值给了新变量，本质上它和state.selectedTrainerMovements还是同一个数组。当你调用push方法时，直接修改了原state里的数组，而Redux（或React的状态管理机制）要求state是不可变的，不能直接修改原数据结构，所以才会抛出这个错误。

正确的写法

要解决这个问题，你需要先创建原数组的浅拷贝，再对拷贝后的新数组进行操作，这样就不会影响原state的不可变结构。这里给你两种常见的正确实现方式：

方式一：先拷贝再操作

case ADD_MOVEMENT:
  // 用扩展运算符创建原数组的浅拷贝
  const am_selectedTrainerMovements = [...state.selectedTrainerMovements];
  // 找到需要添加的movement
  const targetMovement = state.trainerMovements.find(
    movement => movement.id === action.movement.id
  );
  // 找到后再添加到新数组
  if (targetMovement) {
    am_selectedTrainerMovements.push(targetMovement);
  }
  // 返回新的state对象
  return {
    ...state,
    selectedTrainerMovements: am_selectedTrainerMovements
  };
break;

方式二：更简洁的直接返回写法

case ADD_MOVEMENT:
  const targetMovement = state.trainerMovements.find(
    movement => movement.id === action.movement.id
  );
  return {
    ...state,
    // 如果找到目标movement，就创建新数组并添加；否则保持原数组不变
    selectedTrainerMovements: targetMovement
      ? [...state.selectedTrainerMovements, targetMovement]
      : state.selectedTrainerMovements
  };
break;