React - 当 Material UI 对话框打开时启用后台滚动

Question

我有一个可以打开和关闭材质 UI 对话框的组件。目前，页面上显示了一些文本，后面跟着一个用于打开对话框的按钮。我创建了一个代码沙箱来突出显示我的位置： https: //codesandbox.io/s/formdialog-material-demo-forked-cgjgh ?file=/demo.js:0-8775

当对话框打开时，是否可以在后台（即主页上）启用滚动，以便用户可以滚动文本作为示例？我已经添加了hideBackdrop道具，以便true隐藏背景，但我不知道如何做到这一点，以便可以启用主页上的滚动。

Answer 1

对我来说，将“disableScrollLock”属性设置为 true 解决了问题。我在 Material UI Modal 文档下找到了它： https://mui.com/material-ui/api/modal/

<Dialog open={open} 
        onClose={handleClose} 
        hideBackdrop={true}
        disableScrollLock
  >

我在您的 CodeSandbox 示例中测试了它，它按预期工作。希望这有助于解决您的问题！