透明可滑动抽屉材质-UI

Question

我需要知道如何从Material UI将“透明”样式的背景应用于我的SwipeableDrawer组件...由于该组件在呈现时在html文件中创建了另一个组件，因此我无法从代码中更改其背景。 我试图放一些，但似乎该组件不喜欢它。

谢谢。

Answer 1

如Material-ui Docs中所述，您可以使用Modal覆盖ModalProps的样式。 使用BackdropProps中的Modal，可以将背景设置为透明。

创建一个styles变量并应用必要的样式。

const styles = {
  BackdropProps: {
    background: 'transparent'
  }
};

使用Backdrop属性将样式应用于classes的根

<SwipeableDrawer ModalProps={{
          BackdropProps:{
            classes:{
              root:classes.BackdropProps
            }
          }
        }}
        {...otherProps}>

看看docs

中具有类的重写组件