无法对材质UI中的选项卡应用水平滚动

时间:2020-01-29 11:41:13

标签: javascript css reactjs material-ui

我无法使用实际用户界面将水平scroll应用于选项卡。

下面的链接是我正在使用的重要ui版本 https://v0.material-ui.com/#/components/tabs

Tab的数量增加了其占用的宽度。

我尝试应用宽度,但是它占用了整个“标签”标签。

我只需要应用制表符宽度和水平滚动。

<Tabs
inkBarStyle={{backgroundColor: 'blue'}} 
value={this.state.tableNameTab}
onChange={this.handleChangeTab}
key = "tabsData"
style={{ maxWidth: "500px", overflow: "auto" }}
>
{this.state.TableDetails.map( (data,index) =>
<Tab 
label={data.tableName} value={data.tableName}
key={'key'+index}
>
<h6>{data.tableName}</h6>
</Tab>
)
}
</Tabs>

1 个答案:

答案 0 :(得分:0)

欢迎您!

使用scrollable-force-tab可以在scoll的{​​{1}}内部实现 标头

在他们的Official Doc中提到的内容,请看看