【发布时间】：2018-06-25 19:42:50
【问题描述】：
TL;DR：如何将分页状态存储在 Redux 存储中，给定具有大量资源的大型规范化状态树以及显示不同分页结果的多个视图？
我想知道在 Redux 存储中存储分页数据的最佳方式是什么。 This article 规定将分页信息存储为状态树中自己的子树。我同意这种方法，但在这里我不同意：文章建议通过分页资源的类型来键入分页子树，但是如果有多个视图使用不同的参数显示同一资源的分页数据怎么办？如果你按照文章的方法，你的状态树最终可能会是这样的
{
pagination:
todos:
count: 1000,
nextPageUrl: ...,
result: [list of id's]
users:
count: 200,
nextPageUrl: ...,
result: [list of id's]
}
如果您有多种方式来查看同一资源，这对我来说似乎没有意义。如果在一个屏幕上有多个表格显示使用不同参数获取的待办事项怎么办？例如，一个表显示从/api/todos/?userId=1 获取的待办事项，另一个显示从/api/todos/?userId=2 获取的待办事项。
鉴于上述问题，似乎允许更灵活分页的解决方案是基于每个组件而不是每个实体存储分页状态。所以你的状态可能看起来像这样
{
pagination:
componentId:
count: 1000,
nextPageUrl: ...,
result: [list of id's]
anotherComponentId:
count: 1000,
nextPageUrl: ...,
result: [list of id's]
}
当然，像这样存储分页结果会丢失分页内容的上下文。但这有那么大的问题吗？您如何对具有相同资源的可能多个分页结果的大型状态树进行分页？谢谢！
【问题讨论】：
-
我尽量不考虑实体、资源和组件，而是考虑视图。所以每个视图都可以有自己的分页。我认为它类似于上面的第二个示例，除了它不是 1:1 绑定到组件。例如，您可以有一个 TodoList 组件，该组件具有多个不同的视图（即，它显示在页面的不同位置，每个位置具有不同的上下文）。
-
我也是这么想的，但我不确定该组件如何在 Redux 状态下创建它的唯一分页键。如果在一个页面中放置多个 TodoList 组件，
mapStateToProps函数会是什么样子？父组件是否会为每个 TodoList 组件提供一个唯一的key属性，该组件在mapStateToProps中使用该属性来获取分页状态？ -
我认为每个视图都有自己的 reducer，并且使用 combineReducers 每个视图都会获得自己的状态切片。
标签： reactjs pagination redux react-redux