如何在material-ui中更改抽屉的位置？

Question

在material-ui中改变抽屉的位置

我正在尝试将 paddingLeft 样式应用于抽屉。

由于某种原因，我的代码无法正常工作。有没有人知道这里发生了什么？

  <Drawer
        containerStyle={{paddingLeft:50}}
        className="app-sidebar-content"
        variant={type}
        open={type.includes("temporary") ? navCollapsed : true}
        onClose={this.props.onToggleCollapsedNav}
        classes={{
          paper: "side-nav"
        }}
      >
        <UserInfo />
        
      </Drawer>

Answer 1

使用 CSS API 的 modal 元素，您可以实现您想要的：

<Drawer
  open={xxx}
  onClose={yyy}
  classes={{
     paper: classes.paper,
     modal: classes.modal
  }}
>...</Drawer>

然后

const styles = {
  modal: {
    paddingLeft: 50,
  },
}

参考：https://material-ui.com/api/drawer/

Answer 2

您使用的是哪个版本？

使用最新版本的material-ui，您可以传递classes对象并设置组件层次结构的样式。

希望这会有所帮助！