Reactjs 无后端的反应分页

我有以下父组件，其中包含多个子组件：

class Parent extends React.Component {
  render() {
    <div>
      <Child id='1'/>
      <Child id='2'/>
      <Child id='3'/>
      <Child id='4'/>
      <Child id='5'/>
      <Child id='6'/>
      <Child id='7'/>
      <Child id='8'/>
    </div>
    }
}

类父级扩展React.Component{
render（）{
}
}

---

我希望在父类中有分页，每个“页面”最多显示3个子组件。有没有一种方法可以在没有复杂后端集成的情况下实现这一点？

使用诸如current\u page\u no之类的状态变量，您可以从诸如prev、next之类的按钮进行更新。然后只显示从当前页面第3页开始的3个子元素。

它的工作原理是为当前正在查看的页面保持单个变量的状态，并根据当前页面有条件地呈现元素。您可以通过直接设置页面的单个链接或任何您喜欢的链接添加到该页面上

---

要了解更复杂的内容，请查看路由，这是将应用程序状态同步到URL栏的概念，使用户可以使用浏览器中的后退/前进按钮进行导航。是许多可用于实现此目的的库之一。

是的，分页可以完全在客户端完成。对于我的情况，什么是最佳选项？如果您阅读可以使用的列表中的项目，请您详细解释一下“仅显示3个子项”好吗？怎么做？不知道你是怎么储存孩子的很难。假设它们包含在一个名为my_children的道具传入的数组中…继续。。。您可以从开始到结束循环索引，并将这个新数组放入渲染的div中。Kingdaro看起来像是创建了一个完整的示例。