将分页箭头放置在表格的两侧而不是页码

【问题标题】：Placing Pagination arrows to the sides of the table instead of page numbers将分页箭头放置在表格的两侧而不是页码
【发布时间】：2020-02-03 15:17:31
【问题描述】：

我必须将我的分页左右箭头选项从底部移动到 bootstrap-table-next 的两侧。我不想要数字，只想要箭头。我在前端使用 React,React-Bootstrap-table-next。我只是在我的表中呈现了分页选项。我进行了很多搜索，但找不到任何满足我查询的内容。这是我的分页代码的一部分。

    <BootstrapTable keyField="Date"  
                            data={this.state.posts} 
                            columns={columns} 
                            filter={ filterFactory() }
                            filterPosition="bottom"
                            pagination={ paginationFactory() }
            />

除了分页还有其他选择吗？

Bootstarp table next

【问题讨论】：

标签： reactjs react-bootstrap-table

【解决方案1】：

您可以通过将选项传递给 paginationFactory(options1) 和下面的选项来自定义

            const options1 = {
            paginationSize: 4,
            pageStartIndex: 0,
            firstPageText: 'First',
            prePageText: ' << ',
            nextPageText: ' >> ',
            lastPageText: 'Last',
            nextPageTitle: 'First page',
            prePageTitle: 'Pre page',
            firstPageTitle: 'Next page',
            lastPageTitle: 'Last page',
            showTotal: true,
            paginationTotalRenderer: customTotal,
            sizePerPageList: [{
                text: '5', value: 5
            }, {
                text: '10', value: 10
            }, {
                text: 'All', value: data.length
            }]  the text
            };

BootstrapTable 像这样，

            <BootstrapTable
            caption={<CaptionElement />}
            keyField='last updated'
            data={ data }
            columns={ columnsData }
            pagination={ paginationFactory(options1) } 
            />

【讨论】：