如何在不发生变异的情况下替换状态？

Question

我正在使用React和Redux，我需要用更新的数据更新我的状态。“我的状态”包含如下对象数组：

[
    {
        "messages": [/*somedata*/],
        "users": [/*somedata*/],
        "avatar": "/*somedata*/",
        "_id": "/*somedata*/",
        "type": "/*somedata*/",
        "createdAt": "/*somedata*/",
        "__v": 0
    },
    {
        "messages": [/*somedata*/],
        "users": [/*somedata*/],
        "avatar": "/*somedata*/",
        "_id": "/*somedata*/",
        "type": "/*somedata*/",
        "createdAt": "/*somedata*/",
        "__v": 0
    }
]

所以在这个reducer中，我只想用我的负载替换或更新整个状态数组，但不改变我的状态。我的有效负载还包含与上面相同的对象数组，但包含更新的数据。

const chatsReducer = (state = chats, {type, payload}) => {
  switch (type) {
    case '@updateChats':
        return state = payload //i need something like this but without mutating
    default:
        return state
  }
}

Answer 1

这应该对您有所帮助，它创建了一个新数组，并用您的有效负载数组中的所有对象填充它。

const chatsReducer = (state=chats, {type, payload}) => {
  switch (type) {
    case '@updateChats':
        return [ ...payload ];

    default:
        return [ ...state ];
  }
}