如何使用正确传播的对象更新反应 redux 状态？

Question

我在 localStorage 中保存了一个用户状态，在身份验证后看起来像这样：

  "user" : {
  "first_name":"test19", 
  "last_name":"test19",
  "email":"test19@testmail.com",
  "token" : "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjcyMCwia"
   ...

现在我还有一个表单，一旦服务器返回更新的信息并且我的 reducer 如下所示，它就会触发更新用户状态的操作：

case userConstants.UPDATE_USER:
      return {
        loggedIn: true,
        ...state,
        user: action.user
      };

到目前为止一切顺利，只是从服务器返回的对象不包含令牌，上面的 reducer 的结果是一个没有我需要的令牌的新状态。

知道我做错了什么吗？谢谢！ :)

Answer 1

如果我对你的问题理解正确，你希望避免在更新后丢失令牌。像这样更新你的减速器。

case userConstants.UPDATE_USER:
    return {
        loggedIn: true,
        ...state,
        user: {
            ...action.user,
            token: state.user.token
        }
    };

这里的想法是，在返回新状态之前，您将使用状态中的标记属性（不改变）覆盖 action.user 的标记属性。

Answer 2

先添加状态，它会包含一个旧版本的用户，在主状态销毁后覆盖用户：

case userConstants.UPDATE_USER:
      return {
        loggedIn: true,
        ...state,
        user:{
           ...action.user,
           ...state.user,
        },
      };

如何使用正确传播的对象更新反应 redux 状态？

How to update a react redux state with object spread properly?

reactjs

redux

state

ecmascript-next