在React中实现分页功能可以使用以下步骤:
创建一个分页组件(Pagination):该组件可以接受以下参数:
在分页组件中,使用循环生成页码按钮:
在分页组件中,为每个页码按钮添加点击事件:
在父组件中,定义一个状态变量来表示当前的页码(currentPage)。
在父组件中,定义一个用于处理页码变化的回调函数:
在父组件中,根据当前页码(currentPage)获取对应的数据,并进行展示。
这样,就实现了基本的分页功能。当点击页码按钮时,会触发页码变化的回调函数,从而更新当前页码,并重新渲染分页组件,同时获取对应的数据进行展示。