小编Mit*_* W.的帖子

如何在Redux中构造分页状态

TL; DR:如何在给定的大型状态树,大量资源,多个视图显示不同分页结果的情况下,将分页状态存储在Redux存储中?

我想知道在Redux存储中存储分页数据的最佳方法是什么。本文规定将分页信息存储为状态树中自己的子树。我同意该方法,但是在这里我不同意:本文建议通过要分页的资源类型来为分页子树设置关键字,但是如果有多个视图使用不同的参数显示同一资源的分页数据,该怎么办?如果遵循本文的方法,状态树可能最终看起来像这样

{
  pagination: 
     todos: 
       count: 1000,
       nextPageUrl: ...,
       result: [list of id's]
     users:
       count: 200,
       nextPageUrl: ...,
       result: [list of id's]
}
Run Code Online (Sandbox Code Playgroud)

如果您有多种查看同一资源的方式,这对我来说似乎没有任何意义。如果在一个屏幕上有多个表显示使用不同参数提取的待办事项怎么办?例如,一个表显示从中获取的待办事项,另一表显示从中获取的/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]
}
Run Code Online (Sandbox Code Playgroud)

当然,存储这样的分页结果会丢失有关正在分页的内容的上下文。但这是一个很大的问题吗?您如何对一个大型状态树进行分页,而同一资源可能具有多个分页结果?谢谢!

pagination reactjs redux react-redux

5
推荐指数
1
解决办法
7926
查看次数

标签 统计

pagination ×1

react-redux ×1

reactjs ×1

redux ×1