【发布时间】：2017-04-17 16:41:31
【问题描述】：
我正在开发一个带有 JSX 编码结构的 react JS 组件，它从 api 获取 JSON 数据数组。该组件是一个类似表格的结构，顶部和底部有两个箭头。我想实现一个功能，在单击顶部箭头时，表行应该使用行中的新数据集进行更新，反之亦然，在单击向下箭头时发生。有没有办法实现这个功能？
【问题讨论】：
标签： javascript reactjs ecmascript-6
【发布时间】：2017-04-17 16:41:31
【问题描述】：
您似乎正在尝试进行某种表格分页。您可以通过将当前页面存储在控件的状态和 onClick 处理程序上来做到这一点：
- 如果您在服务器上进行分页和排序，请调用服务器 API 以检索下一页/上一页的数据，然后使用检索到的数据更新状态
- 或者如果内存中已经有所有行但只显示其中的一小部分，则使用要显示的行计算和更新状态
【讨论】：
-
目前我正在从服务器获取所有数据我能够检索数据但我想要做的是单击向上箭头 4 组行应该向上移动，下一组行带有新的数据应该与向下箭头相同。
-
对。在您的 onClick 方法上，您应该设置状态（即，添加您想要显示的那些行，并删除那些您想要隐藏的行）。但仅来自状态，而不是来自存储检索数据的内存中的实际位置。因此，假设您要显示 80 行中的 10 行，然后将这 10 行复制到状态中。当用户单击向下箭头时，您可以通过删除顶部 4 并添加底部 4 来更改这 10 个。