不可变地更新对象列表中的对象列表

Question

我有一个要求，我将从 Axios 调用中获取需要在 redux 存储中更新的对象列表。

例如，假设我有一个这样的初始状态。

const initialState = {

someData: [

  {
    id: 1,
    data: 'some data',
    ...
    chosen: true,
    user:'Joe'
  },
  {
    id: 2,
    data: 'some data',
    ...
    chosen: false,
    user:null
  },
  {
    id: 3,
    data: 'some data',
    ...
    chosen: false,
    user:null
  },
  {
    id: 4,
    data: 'some data',
    ...
    chosen: true,
    user:'Jacob'
  },
  {
    id: 5,
    data: 'some data',
    ...
    chosen: false,
    user:null
  }

]

}

通过 Axios 调用，我将获得商店中需要更新的对象列表。

接收到的对象列表的示例数据：

[

  {
    id: 2,
    data: 'some data',
    ...
    chosen: true,
    user:'Jake'
  },
  {
    id: 3,
    data: 'some data',
    ...
    chosen: true,
    user:'Logan'
  },
  {
    id: 5,
    data: 'some data',
    ...
    chosen: true,
    user:'Felix'
  }
]

我想用对象数组 chosen[更新初始状态下的 chosen 和 user 字段=26=] 和 user，这是我在 Axios 调用中收到的。我在考虑一种逻辑，我可以将接收到的对象的 ID 与状态的对象 ID 进行比较。如果它们相等，我将更新选择的和用户（使用扩展运算符），否则我将只 return 状态的对象。我不确定如何映射状态或接收到的对象列表并比较 ID。请有人帮我解决这个逻辑。

Answer 1

return {
      ...state,
      someData: state.someData.map(item => {
        const replaceWith = updatedData.find(
          updatedItem => item.id === updatedItem.id
        );
        return replaceWith
          ? { ...item, chosen: replaceWith.chosen, user: replaceWith.user }
          : item;
      })
    };

不可变地更新对象列表中的对象列表

Updating a list of objects in a list of objects immutably

javascript

immutability

reactjs

redux