javascript - 合并数组中项目和 redux 中对象的值

Question

所以我正在使用redux和reactjs，尽管问题不相关:

我有这个收藏

const items = [
  {id: 0, name: 'one'},
  {id: 1, name: 'two'},
  {id: 2, name: 'three'}
]

const itemsWithTheFlag = [
  {id: 0, flag: false},
  {id: 1, flag: true},
  {id: 2, flag: false},
]

那么我的初始状态是:

{
  items: items
}

现在我想知道如何在 items 数组中执行查找和更新，

我的功能之一是模拟async请求并从itemsWithTheFlag接收项目

export function fetch(id) {
  const desiredItem = find(itemsWithTheFlag, (item) => (item.id === id))
  return (dispatch, getState) => {
    return new Promise((resolve) => {
      setTimeout(() => {
        dispatch(receiveItem(desiredItem))
        resolve()
      }, 100)
    })
  }
}

现在我需要帮助来更新状态，使用从 fetch 收到的更新的合并值和初始状态items

[RECEIVE_ITEM]: (state, action) => {
  return Object.assign({}, state, {
    // how ??
  })
}

我当然想保持不变性，使用lodash也可以

Answer 1

您需要重新创建整个数组并使用相应的 id 修补项目。

return Object.assign({}, state, {
    items: state.items.map(
       item => (
         item.id === action.desiredItem.id
         ? Object.assign({}, item, desiredItem)
         : item)
    )
  })