具有选项卡的appbar内部的材质UI嵌套抽屉和appbar

时间:2018-06-28 14:50:24

标签: javascript reactjs material-ui

在我的应用程序中,我有几个文件的标签,每个文件都应具有自己的抽屉和应用栏。 codeandbox与我正在尝试的类似。

https://codesandbox.io/s/wyv8m32kk7

如您所见,第一个选项卡的内容位于抽屉下方。您如何防止这种情况?

我尝试像应用程序栏一样向内容添加左页边距,但这并不能解决问题。

1 个答案:

答案 0 :(得分:0)

这是由于抽屉中的position: relative与包裹在其中的display: block div相互作用所致。

要实现此效果(导航抽屉位于应用栏下方),请使用Z-index和padding / margin:

drawerPaper: {
    zIndex: 0,
    paddingTop: 60,
    width: drawerWidth,
  },

来源:https://github.com/mui-org/material-ui/issues/957