Material UI 抽屉永久变体不工作。搬出地方

Question

我创建了一个 Material UI 屏幕。其中有这个结构

<div>
<Router>
  <Appbar>
  </Appbar>

  <Drawer>
  </Drawer>

  <main>
  </main>
</Router>
</div>

我为抽屉使用了变体="permanent"。

问题：主标签内的内容很大table，有很多列。我在抽屉外使用过class。但是当在 table 容器中向左水平滚动时，抽屉也会随之向左移动。我正在使用永久变体，然后它也向左移动。

关于这个的任何想法。我认为 Drawer 和主标签是附加的，所以向左滚动 table，将它们都滚动。

Appbar位置固定。试图使导航抽屉也固定；这是模型的样子。

更新：将代码移至 Codepen https://1hi76.csb.app/

Answer 1

您可以将 overflow: auto 设置为 main 标签：

content: {
  flexGrow: 1,
  padding: theme.spacing(3),
  overflow: "auto"
}

Material UI Drawer permanent variant not working. Moves out of place