如何修改Material-UI <select>下拉div的z-index？

Question

我正在渲染具有较大z-index值的（使用withStyles，它的值为theme.zIndex.modal + 2，计算得出为1202）。 原因是要确保我的组件在打开时保持隐藏（即修剪的抽屉）。 但是，当我在应用程序栏中渲染组件时，“下拉” div的z-index值不足以显示，因此最终被隐藏在应用程序栏的后面。 基本示例如下： 让Test =（{classes}）=>（        <工具栏>       <选择>          {“ Item 1”}          {“ Item 2”}                ） const styles = theme =>（{   应用栏：{     zIndex：theme.zIndex.modal + 2     边距：0   } }） 测试= withStyles（styles）（Test）; 覆盖的任何公开类上的z-index似乎都不能解决我的问题。如何确保<选择>出现在的前面？

Answer 1

您可以在style

中的所有组件上使用Material-UI属性

<Select style={ zIndex: X } >
  ...
</Select>

cf：https://v0.material-ui.com/#/components/select-field
有关所有可用样式属性的详细信息

Answer 2

您可以在Drawer组件上使用PaperProps来调整zindex，而不用更改Select组件的zindex。