reactjs - BootstrapTable2分页每页下拉的项目数不显示

Question

我将BootstrapTable2与 Bootstrap4 一起使用。一切正常，除了当我单击每页的项目数时，选择项目数的下拉菜单不显示。

这是我的代码（它基于此示例：

import React, {Component} from 'react';
import BootstrapTable from 'react-bootstrap-table-next';
import paginationFactory from 'react-bootstrap-table2-paginator';

render(){

        const columns =  [
                      {
                          text: "Item",
                          dataField: 'Title',
                          sort: true
                      },
                      {
                          text: "Quantity",
                          dataField: 'Quantity',
                          sort: true
                      },
                      {
                          text: "Needed By",
                          dataField: 'DateNeeded',
                          sort: true
                      },
                      {
                          text: "Requested By",
                          dataField: 'RequesterUsername',
                          sort: true
                      }
                  ]
        return(
            <div>
                <script src="webjars/popper.js/1.14.7/umd/popper.min.js"></script>

                <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
                <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

                {this.state.data != null && <BootstrapTable keyField='id' bootstrap4 data={ this.state.data } columns={ columns } pagination={ paginationFactory() } />}
            </div>
            )

    }

这是我当前的版本：

"bootstrap": "^4.4.1",
"jquery": "^3.5.0",
"popper.js": "^1.16.1",
"react": "^16.13.1",
"react-bootstrap": "^1.0.1",
"react-bootstrap-table-next": "^4.0.1",
"react-bootstrap-table2-paginator": "^2.1.2",

Answer 1

原来，下拉菜单实际上被切断了，因为溢出被​​隐藏了。

添加这个css解决了这个问题：

    .dropdown{
        overflow: visible !important;
    }