javascript - 数据应该放在 redux 状态树中吗？

Question

我对在 Redux 的状态树中保留什么有点迷茫。

我看到关于在状态树中存储什么的两个相互矛盾的陈述。

• React doc告诉我们只有用户输入应该存储在状态树中。

The original list of products is passed in as props, so that's not state. The search text and the checkbox seem to be state since they change over time and can't be computed from anything. And finally, the filtered list of products isn't state because it can be computed by combining the original list of products with the search text and value of the checkbox.

• Redux doc告诉我们，我们通常应该将 UI 状态和数据存储在单个状态树中:

For our todo app, we want to store two different things:

• The currently selected visibility filter;
• The actual list of todos.

You’ll often find that you need to store some data, as well as some UI state**, in the state tree. This is fine, but try to keep the data separate from the UI state.

所以 React 告诉我们不应该存储数据(我说的是待办事项的数据)，对我来说，Redux 告诉我们相反的事情。

据我所知，我会倾向于 React 方面，因为 React 和 Redux 都旨在通过存储来预测 UI 状态:

1. 所有无法计算的内容(例如:所有人工输入)并且是 UI 的一部分:

   • 复选框值
   • 输入值
   • radio 值
   • ...

2. 可用于构建查询并将其发送到 API/数据库的所有最小数据将返回完整的用户配置文件、好友列表等...:

   • 用户编号
   • 创建日期范围
   • 项目 ID
   • ...

对我来说，排除了所有数据库/API 结果，因为:

• 站在数据层面
• 可以通过发送正确的(并由纯 reducer 计算)查询来计算。

那么您对此有何看法？

Answer 1

关于 View Component state 的 React 文档，但是关于 Application state 的 Redux 文档。因此，定义之间不存在冲突。

如果我们谈论 Redux - 您让所有组件都没有状态(并借助 react-redux 的 connect 功能将无状态根组件转换为有状态)。如果你有来自服务器的大量响应并且你使用分页/过滤器显示你的数据，你可以将你的应用程序状态视为你在屏幕上看到的，而不是将所有数据放在 Redux 存储中，只有你需要render(例如，100 行显示页面和总行数显示分页)。 对此没有限制。您可以将整个数据放在另一个地方。例如，在 web-worker 中的另一个数据容器中(我在 web-worker 中发出完整请求并从那里获取只需要显示的数据)。

---

问题编辑后添加:

The original list of products is passed in as props, so that's not state.

在那个例子中，产品列表没有状态的原因 - 它已经在 props 中。这意味着父组件之一具有此状态。