Material ui 如何更改从inputBase、outlined及其伪类继承的select组件的CSS

我正在尝试自定义材质ui的选定组件的CSS，这是从class=“MuiInputBase-root-97 MuiInput-root-84 MuiInput-underline-88 MuiInputBase-formControl-98 MuiInput-formControl-85”继承而来的，现在我无法更改默认设计。请帮帮我，我对材料界面没有太多经验

我尝试在类props中传递一个对象，该类props为select to change样式，由MuiInputBase-root-97、MuiInput-root-84、MuiInput-underline-88、MuiInputBase-formControl-98、MuiInput-formControl-85及其伪类应用

const styles = theme => ({
    root: {
      '&$hover': {
      color: 'red',
    },
    },
    inputUnderline: {
      minWidth: 220,
    },
    selectEmpty: {
      marginTop: theme.spacing.unit * 2,
    },
formControl: {
      margin: theme.spacing.unit,
      minWidth: 120,
    },
  });

<FormControl className={classes.formControl}>
          <Select
            value={this.state.age}
            onChange={this.handelchange}
            name="age"
            displayEmpty
            className={classes.selectEmpty}
            classes={{
            underline: classes.inputUnderline //change css of MuiInput-underline-88 and their pseudo class
            root: classes.inputBaseRoot //want to change css of MuiInputBase-root-97 and their pseudo class
            }}
          >
            <MenuItem value="" disabled>
              Placeholder
            </MenuItem>
            <MenuItem value={10}>Ten</MenuItem>
            <MenuItem value={20}>Twenty</MenuItem>
            <MenuItem value={30}>Thirty</MenuItem>
          </Select>
          <FormHelperText>Placeholder</FormHelperText>
        </FormControl>

constyles=theme=>({
根目录：{
“&$hover”：{
颜色：“红色”，
},
},
输入下划线：{
最小宽度：220，
},
选择空：{
marginTop:theme.space.unit*2，
},
表单控制：{
边距：theme.space.unit，
最小宽度：120，
},
});
占位符
十
二十
三十
占位符

我想删除悬停、聚焦、之后和之前底部的边框

---

我希望其中的自定义设计覆盖选定组件中的所有CSS类。在material ui中，您可以覆盖样式并根据需要进行自定义

请参阅