2

normalizr用来组织我的redux-store 状态。

假设我已经标准化了待办事项列表:

{
  result: [1, 2],
  entities: {
    todo: {
      1: {
        id: 1,
        title: 'Do something'
      },
      2: {
        id: 2,
        title: 'Second todo'
      }
    }
  }
}

然后我想实施addTodo行动。我需要在 todo 对象中有一个 id,所以我生成一个随机的:

function todoReducer(state, action) {
   if(action.type == ADD_TODO) {
       const todoId = generateUUID();
       return {
          result: [...state.result, todoId],
          enitities: {
            todos: {
              ...state.entities.todos,
              [todoId]: action.todo
            }
          }
       }
   }
   //...other handlers...
   return state;
}

但问题是最终所有数据都将保存到服务器,并且生成的 id 应该替换为真实的服务器分配的 id。现在我像这样合并它们:

//somewhere in reducer...
if(action.type === REPLACE_TODO) {
   // copy todos map, add new entity, remove old
   const todos = {
     ...state.entities.todos
     [action.todo.id]: action.todo
   };
   delete todos[action.oldId];

   // update results array as well
   const result = state.result.filter(id => id !== oldId).concat(action.todo.id);
    // return new state
    return {entities: {todos}, result};
}

这似乎是一个可行的解决方案,但也有很多开销。你知道有什么方法可以简化这个并且不进行REPLACE_TODO操作吗?

4

0 回答 0