如何重写material UI muiccard -root类中的overflow属性?

Question

这是我的style:

const styles = (theme) => ({
panel: {
position: 'absolute',
zIndex: 10,
},
setLink: {
display: 'inline',
textDecoration: 'underline',
cursor: 'pointer',
whiteSpace: 'nowrap',
},
field: {
width: '100%',
},
dropUp: {
transform: `translateY(calc(-100% - ${theme.spacing(3)}px))`,
},
});

但是在MuiCard-root类上溢出设置为隐藏。我如何重写它为可见?

Answer 1

我不知道你想做什么，但是正如文档所说:

当配置变量不够强大时，您可以利用主题的overrides键来潜在地更改由Material-UI注入到DOM中的每一个样式。

下面是一个例子:

import { createMuiTheme, ThemeProvider } from '@material-ui/core/styles';
const theme = createMuiTheme({
overrides: {
// Style sheet name ⚛️
MuiCard: {
// Name of the rule
root: {
// Some CSS
overflow: 'visible',
},
},
},
});

你必须用:

包装你的组件

<ThemeProvider theme={theme}>
...
</ThemeProvider>

查看这里的代码片段

编辑

添加自定义className到您的组件

<Card className={classes.customCardName}>

在你的样式中加上这个

customCardName: {
overflow: "visible"
}