material-ui - 后台中“withStyles”的Material-UI主题覆盖？

Question

如何覆盖 Material-UI 中通过 应用样式的组件的主题withStyles？

当我查看有问题的组件时，我在 DOM 中看到以下内容：

我正在尝试重新设置 Backstage 的样式，并且现在正在查看 MuiSelect 组件。Backstage 通过使用withStyles. 查看 DOM 我正在​​尝试调整通过WithStyles(ForwardRef(InputBase))-input-75764类应用的 CSS。

在 Backstage 的Select.tsx组件文件中，样式是这样定义的：

const BootstrapInput = withStyles((theme: Theme) =>
  createStyles({
    root: {
      'label + &': {
        marginTop: theme.spacing(3),
      },
    },
    input: {
      borderRadius: 4,
      position: 'relative',
      backgroundColor: theme.palette.background.paper,
      border: '1px solid #ced4da',
      fontSize: 16,
      padding: '10px 26px 10px 12px',
      transition: theme.transitions.create(['border-color', 'box-shadow']),
      fontFamily: 'Helvetica Neue',
      '&:focus': {
        background: theme.palette.background.paper,
        borderRadius: 4,
      },
    },
  }),
)(InputBase);

如何使用 Material-UIcreateTheme来定位这些样式？

Answer 1

这里有一个关于如何覆盖命名 Backstage 组件的样式的指南。

对于没有可用覆盖名称的 Backstage 组件，可以在此 pull request中添加它们。