分页下拉不起作用 react-bootstrap-table2

Question

我正在使用 react-bootstrap-table2 并且无法使分页下拉菜单正常工作。

查看我的选项：

        const options = {
            paginationSize: 4,
            pageStartIndex: 0,
            //alwaysShowAllBtns: true, // Always show next and previous button
            //withFirstAndLast: false, // Hide the going to First and Last page button
            // hideSizePerPage: true, // Hide the sizePerPage dropdown always
            // hidePageListOnlyOnePage: true, // Hide the pagination list when only one page
            firstPageText: 'First',
            prePageText: 'Back',
            nextPageText: 'Next',
            lastPageText: 'Last',
            nextPageTitle: 'First page',
            prePageTitle: 'Pre page',
            firstPageTitle: 'Next page',
            lastPageTitle: 'Last page',
            sizePerPageList: [{
                text: '5', value: 5
            },{
                text: '10', value: 10
            },{
                text: 'All', value: this.state.currentlyDisplayed.length
            }] // A numeric array is also available. the purpose of above example is custom the text
        };

还有我的表格组件

                            <BootstrapTable
                                className="bsTable"
                                striped={true}
                                hover={true}
                                keyField='id'
                                data={this.state.currentlyDisplayed}
                                columns={columns}
                                pagination={ paginationFactory(options) }
                                filter={ filterFactory({delay:100}) }
                                fetchInfo={{dataTotalSize: this.state.currentlyDisplayed.length}}
                            />

有什么想法吗？我点击它希望看到 5,10，但它没有响应。我的表中也有超过 5 条记录...

Answer 1

将此添加到您的 CSS：

.show.react-bs-table-sizePerPage-dropdown ul:last-child {
  display: block;
}