抽屉组件Backdrop阻止用户在页面打开时与页面交互

Question

我有一个抽屉组件锚定在底部，但我仍然想与抽屉上方的页面交互，但要么我可以点击退出if，但抽屉关闭了，所以我尝试了持久和永久的变体，它们都不起作用，所以当我点击退出if时，什么都不会发生。我认为这与上面的间距或填充有关，但如果有人知道如何禁用它，我们将不胜感激。

Answer 1

我通过删除"；插入"；.MuiDrawer-modaldiv的CSS属性：

.MuiDrawer-modal {
inset: unset !important;
}

Answer 2

解决了我的问题，我最终不得不对Paper组件进行一些高度更改，它似乎按照我想要的方式工作。您可以在@material-ui/core/styles目录中使用makeStyles方法覆盖css。我使用了类属性示例

// Outside the component
import { makeStyles } from '@material-ui/core/styles';
const useStyles = makeStyles({
drawer: {
css here ... 
}
})
// Inside Component 
const classes = useStyles() // the make styles returns a function and calling the useStyles returns an object with the css. 
// Inside return 
<Drawer
anchor="bottom" 
classes={{ paper: classes.drawer }}
>
Content... 
</Drawer>