滚动到底部时无法完全显示展开的表格

Question

我使用react来创建一个功能，在页面上，用户可以选择一个组，当选择一个组时（在区域G中），其成员可以立即显示在该组的用户中＃＆ 39;（在U区）。我的问题是，使用这种布局，在表格区域G中展开表格时 即使滚动条滚动到底部也无法完全显示。

渲染部分是

<div className ={'outermost-container'} style={overflowY:'auto',display:'flex',flexWrap:'wrap',justifyContent:'space-around',}>
    {/*for Area G, */}
    <div>selectableTable</div>
    {/*for area U*/}
    <div style={display:'flex',justifyContent:'space-around'}>
        {/*for left table of area U*/}
        <div>selectableTable</div>
        {/*for buttons in the middle of area U*/}
        <div style={display:'flex' flexDirection:"column"}>2 buttons</div>
        {/*for right table of area U*/}
        <div>selectableTable</div>
    </div>
<div>

这是通过https://www.material-ui.com/#/components/list

实现的

通过这种布局，有什么方法可以在展开时向下滚动到底部时显示完整的表格？欢迎任何想法。

Answer 1

我将左侧的列表移出flexbox，并使用百分比表示大小。