css - material-ui改变抽屉的高度

标签 css reactjs material-ui

我在我的元素中使用了 React 和 Material-UI,我遇到了一个我不知道如何解决的简单问题。 我想创建一个抽屉并设置其高度,使其在打开时不会覆盖应用栏。

Drawer 组件中没有高度参数,我也尝试覆盖它的样式并在样式对象上设置高度,如下所示:

<Drawer style={{height:'90%'}} />

但是没有用。

我能想到的唯一方法是编辑 Drawer 组件的代码,但我当然想避免这种情况。

关于如何定义高度的任何想法?

最佳答案

给你:

<Drawer open={this.state.open} containerStyle={{height: 'calc(100% - 64px)', top: 64}}>
  <MenuItem>Menu Item</MenuItem>
  <MenuItem>Menu Item 2</MenuItem>
</Drawer>

关于css - material-ui改变抽屉的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37712038/

相关文章:

javascript - 使用 Material UI Tooltip 测试组件时发出警告

css - React 和 MUI - 我的点击按钮动画没有像我想要的那样工作

javascript - Chrome 和 Firefox 之间计算的高度不同?

javascript - 图像 slider 未出现

javascript - 显示来自 REST API 的用户列表并使用 React 进行过滤

reactjs - 从身份服务器登录页面启动授权代码流的正确方法是什么?

html - 在图像中间居中 Bootstrap div

jquery - CSS 中 "class"目标的功能/用途是什么?

javascript - 单击 <div>,焦点输入字段 - 如何使用 React/Redux 执行此操作?

material-ui - 使用 Jest 和快照测试 material-ui 组件