javascript - Redux Reducer - 如何在不改变状态的情况下更新对象值？

Question

我的 reducer 是这样的:

  const players = (state = {}, action) => {
    switch (action.type) {
      case 'UPDATE_PLAYERS_CARDS':
        return Object.assign({}, state, {
          [action.player]: {
            name: state[action.player].name,
            score: state[action.player].score,
            cards: action.cards
          }
        })
       default:
         return state
    }
  }

  export default players

基本上，我只想更新球员卡片，但如果我不包括姓名和分数，那么这些卡片会在新状态下被删除。

理想情况下，我只需要做这样的事情:state[action.player].cards = action.cards 但规则之一是永远不要改变状态 .

上面的方法可行，但这需要我始终了解数据结构，因此如果我将来向它添加其他内容，我需要记得回到这个 reducer 并将其添加回去，这样我就不会'失去它。

有没有更好的方法来完成这个？

编辑:感谢 Vijay 对多个对象分配的建议。我最终让它与这个一起工作:

case 'UPDATE_PLAYERS_CARDS':
  const playerObject = Object.assign(state[action.player], { cards: action.cards });
  return Object.assign({}, state, {
    [action.player]: playerObject
  });

怎么样？如果我可以做出任何改进，请告诉我。

Answer 1

多个 Object.assign 方法看起来很难看。

你可以这样做:

return { ...state.action.player, cards: action.cards }

注意:您需要 stage-2 babel preset 才能使用它。

一旦要更新的数据结构变得相当复杂，您可以使用 ImmutableJS的 setIn、updateIn 方法可以轻松地进行深度更新。