使用makeStyles覆盖材质UI样式

Question

我在一个小型投资组合网站上工作，我添加了一个头像，并试图用makeStyles类覆盖它的风格，尽管Mui头像根正在覆盖我的类

这是可以做到的没有使用！重要的

export const HomePage = () => {
const classes = useStyles()
return (
<Grid container justifyContent="center">
<Avatar className={classes.headerAvatar} src={avatar} alt="" />
</Grid>
)
}

export const useStyles = makeStyles(theme => ({
headerAvatar: {
width: theme.spacing(13),
height: theme.spacing(13),
margin: theme.spacing(1)
},
}))

Answer 1

根据文档，您可以使用classes道具覆盖root类的css样式，如：

export const HomePage = () => {
const classes = useStyles()
return (
<Grid container justifyContent="center">
<Avatar classes={classes} src={avatar} alt="" />
</Grid>
)
}

export const useStyles = makeStyles(theme => ({
root: {
width: theme.spacing(13),
height: theme.spacing(13),
margin: theme.spacing(1)
},
}))