Material-ui 样式对话框/模态背景

【问题标题】：Material-ui style dialog / modal backdropMaterial-ui 样式对话框/模态背景
【发布时间】：2019-08-12 12:45:40
【问题描述】：

如何设置 Material-ui 对话框或模态框的透明深色叠加层？我正在使用 material-ui/React/Typescript。

我希望它不是透明的黑色，而是透明的白色。我更喜欢JSS 解决方案，但欢迎使用内联样式。

【问题讨论】：

标签： css typescript material-ui jss react-tsx

【解决方案1】：

你可以使用modal的BackdropProps属性：

<Modal
          aria-labelledby="simple-modal-title"
          aria-describedby="simple-modal-description"
          open={this.state.open}
          onClose={this.handleClose}
          BackdropProps= {{
              classes: {
                  root: classes.backDrop
              }
          }}
        >

在你的样式对象中：

...
backDrop: {
    background: 'rgba(255,255,255,0.2)',
  },

【讨论】：

谢谢，但我必须将 classes.backDrop 替换为 classes.modalRoot 才能使其正常工作。您可能想要编辑您的答案。