主要用到DetailList,具体用法可以参考:Pagination,效果图如下:
1.在上篇文章的基础上:React list数据显示(含源码)Demo,添加Pagination库的引用
import Pagination from 'rc-pagination';
import 'rc-pagination/assets/index.css';
2.在<DetailList>下面添加<Pagination>标签
<div className="content-foot-page">
<Pagination onChange={this.pageNumberOnChange} total={this.state.allAudits.length} current={this.state.currentPage} />
</div>
3.点击page具体某页触发onChange={this.pageNumberOnChange}事件,注意别忘了bind.这里showPageNumberAudits是每一页要显示的,pageSize自己定义,我这里是10。另外<DetailList>