javascript - 批量更新规范化的 Redux 状态

Question

假设我有这样的标准化状态(使用 normalizr)

entities: {
  todos: {
    'aaa': {
      id: 'aaa',
      text: 'Todo A',
      completed: false
    },
    'bbb': {
      id: 'bbb',
      text: 'Todo B',
      completed: false
    },
    'ccc': {
      id: 'ccc',
      text: 'Todo C',
      completed: false
    }
  }
}

然后我有一个从服务器获取 ID 数组的操作，这些操作已完成。对于那种 Action 类型，我有这样的 reducer :

const todos = (state = initialState, action) => {
  switch (action.type) {
    case ActionTypes.FETCH_COMPLETED_SUCCESS:
      return {
        ...state,
        todos: action.payload.completedIds.map((id) => {
          return {
            [id]: {
              ...state.todos[id],
              completed: true
            }
          }
        })
      };
    default:
      return state;
  }
};

如果我收到一个带有 ['aaa', 'ccc'] 的数组(在现实世界的应用程序中可能有数千个项目)，我想在单个操作中将这些相应待办事项的“已完成”设置为 TRUE，是吗可能吗？

我当前的 reducer 实现不起作用，因为它返回一个对象数组，而原始规范化状态是以 ID 作为键的对象。

谢谢。

Answer 1

您可以将修改后的待办事项存储在一个对象中，然后使用像这样的扩展语法更新它

const todos = (state = initialState, action) => {
  switch (action.type) {
    case ActionTypes.FETCH_COMPLETED_SUCCESS:
      let newTodos = {};
      action.payload.completedIds.forEach((id) => {
          newTodos[id]: {
              ...state.todos[id],
              completed: true
            }
          })
        })
      return {
        ...state,
        todos: {
             ...state.todos,
             ...newTodos
        }
      };
    default:
      return state;
  }
};