如何覆盖Material-UI内置类

Question

.MuiFormGroup-root-201 {       
    display: flex;      
    flex-wrap: wrap;      
    flex-direction: column;      
}

如何将flex-direction属性列覆盖为行？

Answer 1

您可以覆盖默认主题：

App.tsx

import { createMuiTheme, MuiThemeProvider } from "@material-ui/core/styles";
import themeConfig from "lib/material-ui/theme";

const theme = createMuiTheme(themeConfig);

class App extends PureComponent<IAppProps> {
public render() {
    return (
        <MuiThemeProvider theme={theme}>
        //.. 

lib / material-ui / theme.tsx

import overrides from "./overrides";
import typography from "./palette";

export default {
   palette,
   overrides,
};

./ overrides.ts

export default {
    MuiFormGroup: {
        root: {
            display: "flex";
            flexWrap: "wrap";
            flexDirection: "row";
        },
    },
}