React Material UI 全部大写

Question

有没有一种方法可以在主题描述中以大写形式显示所有文本（textTransform），一劳永逸。大写静态文本、输入和获取的数据？

Answer 1

textTransform您可以使用以下方法在容器类上设置makeStyles：

const useStyles = makeStyles({
    root: {
        textTransform: "uppercase"
    }
});

在您的应用程序内部使用root包装元素中的类：

return (
    <div className={classes.root}>

    </div>
);

如果您希望在特定的 Mui 元素上使用此功能，您可以使用createMuiTheme并使用overrides可以在特定元素上指定 css 值：

const muiTheme = createMuiTheme({
    overrides: {
        MuiPaper: {
            root: {
                textTransform: "uppercase"
            }
        },
        MuiBreadcrumbs: {
            root: {
                textTransform: "uppercase"
            }
        }
    }
});

return (
    <MuiThemeProvider theme={muiTheme}>
        ...
    </MuiThemeProvider>
);