Reducer异常：向已有房间添加新用户时丢失原有用户

看起来你遇到的核心问题是向已有房间添加新用户时，覆盖了原有用户列表——这是编写Reducer时很容易踩的坑，本质是更新嵌套状态时没有正确保留原有数据。

问题根源分析 #

在处理「添加用户到房间」的action时，你的Reducer大概率是直接将users字段赋值为只包含新用户的数组（比如users: [action.payload.user]），而不是在原有用户数组的基础上追加新用户。这种写法会完全替换掉房间原有的用户列表，自然会导致旧用户丢失。

修复方案 #

你需要修改Reducer中处理添加用户的分支逻辑，确保更新用户列表时保留原有用户，再追加新用户。以下是具体的代码调整示例：

// 假设你的action类型是ADD_USER_TO_ROOM，请根据实际代码调整类型名
case 'ADD_USER_TO_ROOM':
  const { roomId, user } = action.payload;
  // 获取目标房间的现有状态，若房间不存在则初始化基础结构（你的场景中房间应该已存在）
  const targetRoom = state[roomId] || { users: [], messages: {} };
  
  return {
    // 保留全局状态的其余部分
    ...state,
    [roomId]: {
      // 复制房间原有的所有状态（比如messages字段）
      ...targetRoom,
      // 扩展原有用户数组，添加新用户——核心修复点
      users: [...targetRoom.users, user]
    }
  };

为什么这样有效？ #

• ...state确保全局状态的其他房间数据不受影响；
• ...targetRoom保留了房间原有的messages等非用户字段；
• [...targetRoom.users, user]遵循Redux的「不可变更新」原则：基于原有用户数组创建新数组并追加新用户，而不是直接覆盖原数组，这样就完整保留了所有原有用户。

按照这个逻辑调整后，当你向cool房间添加第二个用户payne时，用户列表就会变成["max", "payne"]，和你预期的输出完全一致。

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