在 Redux 应用程序中规范化 api 响应有什么意义？

Question

可能是因为我对 Redux 还很陌生，但是如果有人能给我一个简单的用例来使用像 normalizr.

这样的东西，我会很高兴

我不明白这里给出的例子How do I handle nested API responses in a Flux application?

我想我没有明白的是为什么 it's hard 商店要使用嵌套对象。

我的应用程序是一个中大型门户网站，用户可以在其中显示列表、通过与两个不同的 API 对话来创建新项目和新列表。

Answer 1

消费嵌套对象不一定很难。

这完全取决于您的用例以及 UI 的组织方式。

如果你使用 normalizr 没有意义，那就不要使用它。该模块确实不是必需的。

Answer 2

我规范化了我所有的对象，但我不使用 normalizr。

我喜欢规范化，因为它使代码更具可读性。下面的一个例子。它还使引用对象和消除重复变得更加容易。例如，如果您订阅了其他人列表中的待办事项，您要么必须 return 订阅者的 subscribedTodos 列表中该待办事项的重复版本，要么必须知道用户 ID 和待办事项其他待办事项才能完成。

回到可读性：以下哪个更适合 read/understand？

function rootReducer (state, action) {
  const { type, payload } = action;

  if(action.type === MODIFY_TODO) {
    return {
      ...state,
      users: {
        ...state.users,
        [payload.userID]: {
          ...state.users[userID],
          todos: {
            ...state.users[userID].todos,
            [payload.todo.todoID]: {
              ...state[userID].todos[todoID],
              ...todo
            }
          }
        }
      }
    }
  } else { return state; }
}

function rootReducer (state, action) {
  const { type, payload } = action;

  if(type === MODIFY_TODO) {
    return {
      ...state,
      todos: {
        state.todos[payload.todo.id]: {
          ...state.todos[payload.todo.id],
          ...payload.todo
        }
      }
    }
  } else { return state; }
}

在 Redux 应用程序中规范化 api 响应有什么意义？

What's the point of normalizing api responses in a Redux app?

json

reactjs

redux