javascript - Material-UI如何改变下划线和标签颜色

包装您的选择<FormControl />并添加<InputLabel />为<Select />兄弟。
之后，覆盖 InputLabel 根类并提供 className 来选择组件：

const useStyles = makeStyles((theme) => ({
  formControl: {
    margin: theme.spacing(1),
    minWidth: 120,
  },
  underline: {
    color: 'red' ,
    '&::after': {
      borderBottom: '2px solid red'
    },
    '&::before': {
      borderBottom: '2px solid yellow'
    }
  },
  inputLabelRoot: {
    color: 'red',
  }
}));

export default function SimpleSelect() {
  const classes = useStyles();

  return (
    <div>
      <FormControl className={classes.formControl}>
        <InputLabel classes={{root: classes.inputLabelRoot}}>Age</InputLabel>
        <Select
          className={classes.underline}
        >
          <MenuItem value={10}>Ten</MenuItem>
          <MenuItem value={20}>Twenty</MenuItem>
          <MenuItem value={30}>Thirty</MenuItem>
        </Select>
      </FormControl>
    </div>
  );
}