相关疑难解决方法(0)

我正在尝试设置默认主题排版字体大小以根据断点进行更改。例如，当断点位于 {xs} 值时，将 theme.typography.h4.fontSize 更改为 '1.5rem'。在所有其他断点处，将其保留为默认值 ('2.125rem')。

我可以使用以下代码示例在组件中轻松完成此操作：

const useStyles = makeStyles(theme => ({
    title: {
        [theme.breakpoints.down('xs')]: {
            fontSize: '1.5rem',
        }
    },
}))

但是，这意味着必须向其中包含的每个组件添加相同的代码<Typography variant='h4'>。如果我决定将值从 '1.5rem' 更改为 '1.25rem'，我将需要找到每个实例<Typography variant='h4'>并手动更改它。

有没有办法给 createMuiTheme 添加断点，使其适用于所有实例？

我尝试了以下方法，但不起作用：

const defaultTheme = createMuiTheme()

const theme = createMuiTheme({
    typography: {
        h4: {
            [defaultTheme.breakpoints.down('xs')]: {
                fontSize: '1.5rem'
            }
        }
    }
})