javascript - 如何更新 Redux + React 中的嵌套对象属性？

Question

首先，设置具有一些属性(name、color、age)的user对象通过 SET_USER 更新，我想通过 UPDATE_USER_NAME 更新 user 对象中的 name 属性，但是当我使用下面的代码在 UPDATE_USER_NAME 中使用嵌套循环来执行此操作，name 属性不会更新。

我做错了什么？如果我执行类似 user: {action.name, ...state.user} 的操作，对象 user 会更新并工作，但这只是从创建另一个新属性action.name 而不是更新 user 对象中的当前 name。

const DEFAULT_STATE = {
  user: {},
}

export default function(state = DEFAULT_STATE, action) {\
  switch(action.type) {
    case actionTypes.SET_USER:
      return {
        ...state,
        user: action.user,
      }

    case actionTypes.UPDATE_USER_NAME:
      return {
        ...state,
        user: {
          name: action.name,
          ...state.user,
        }
      }

    default:
      return state
  }
}

Answer 1

你只需要稍微改变点差的顺序:

case actionTypes.UPDATE_USER_NAME:
      return {
        ...state,
        user: {
          ...state.user,
          name: action.name,
        }
      }

这会将 user 设置为当前 state.user，然后覆盖 name。传播方式类似于 Object.assign(从左到右)。这是因为在对象字面量中分配相同的键将是“最后一个获胜”。