在 Redux 中思考

Question

我在设计示例应用程序时试图了解 redux。我对状态与数据模型的概念感到困惑。

注意：我没有使用 Reactjs。

示例应用的背景。

2 个表格网格：

网格 A：我网站上的成员列表。

网格 B：成员的所有订单列表，在网格 A 中选择。

• 因此，此应用的最终用户一次只能从网格 A 中选择 1 个成员。
• 最终用户还可以在网格 A 中输入用户名，我的后端服务将返回此成员的详细信息（网格 A）和他们过去的所有订单（网格 B）。

Redux 问题

1. 我的后端服务对我在网格 A 或 B 中列出项目的顺序一无所知。谁应该维护网格中项目的顺序？是商店的责任还是组件的责任？

2. 谁维护在网格 A 中单击了哪个成员？ ?我的后端服务，将所有成员及其所有订单返回给我。它对 UI 上选择的成员一无所知。

让组件保留这些信息，然后在从商店获取的数据刷新时扩充 UI，这是一种好的做法吗？

Answer 1

Redux 用于保存您当前的应用程序状态。但是如何显示它取决于您的组件。

1. 实际上它取决于一个应用程序。有些应用程序有很多类似的表，还有一些组件库，在组件内部处理排序逻辑。但是，如果您的所有应用程序都基于几个表，那么向存储中添加一个指示您的表应如何排序的属性是有意义的，例如：membersSortingType: [asc, desc, none]。然后将members 和membersSortingType 传递给一个函数，该函数进行排序并返回一个新的membersList，然后可以将其传递给您的组件。
2. 这里也是一样，当您单击一个项目时，您可以将其保存到商店，例如：currentMember: id，并且要获取应该在您的组件中呈现的数据，您只需将您的成员 ID 和所有订单传递给一个函数这将做一些过滤。因此，每当您选择新成员时，所有内容都会自动更新。