如何在不發生變異的情況下替換狀態？

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
    }
]

所以在這個減速器中，我只想用我的有效載荷替換或更新整個狀態數組，但不改變我的狀態。 我的有效負載還包含與上述相同的對象數組，但具有更新的數據。

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

這應該對您有所幫助，它會創建一個新數組並使用payload數組中的所有對象填充它。

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

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