@352inc/react-bootstrap-table2-paginator 中文文档教程
react-bootstrap-table2-paginator
react-bootstrap-table2
将分页代码库分离到 react-bootstrap-table2-paginator
,所以当你使用分页时会有一点不同。 下面,我们将向您展示如何启用和配置分页表
Install
$ npm install react-bootstrap-table2-paginator --save
Add CSS
// es5
require('react-bootstrap-table2-paginator/dist/react-bootstrap-table2-paginator.min.css');
// es6
import 'react-bootstrap-table2-paginator/dist/react-bootstrap-table2-paginator.min.css';
How
让我们在您的表格上启用分页:
import paginationFactory from 'react-bootstrap-table2-paginator';
// omit...
<BootstrapTable keyField='id' data={ products } columns={ columns } pagination={ paginationFactory() } />
Customization
请参阅 分页道具
react-bootstrap-table2-paginator
react-bootstrap-table2
separate the pagination code base to react-bootstrap-table2-paginator
, so there's a little bit different when you use pagination. In the following, we are going to show you how to enable and configure the a pagination table
Install
$ npm install react-bootstrap-table2-paginator --save
Add CSS
// es5
require('react-bootstrap-table2-paginator/dist/react-bootstrap-table2-paginator.min.css');
// es6
import 'react-bootstrap-table2-paginator/dist/react-bootstrap-table2-paginator.min.css';
How
Let's enable a pagination on your table:
import paginationFactory from 'react-bootstrap-table2-paginator';
// omit...
<BootstrapTable keyField='id' data={ products } columns={ columns } pagination={ paginationFactory() } />
Customization
See pagination props