Reactjs 如何更改Nativeselect材质UI的颜色图标？

我有一个本地人

<NativeSelect
  input={<BootstrapInput/>}
  onChange={this.handleClick}
>
  <option value="1">1</option>
<NativeSelect>

1.

---

如何更改按钮下拉列表的颜色

下面是一个示例，显示了如何更改箭头下拉图标的颜色，以便通过各种方式（

选择

，

本地选择

，

文本字段

）在材质UI中创建选择。对于

Select

和

NativeSelect

，它利用

图标

CSS类（，）。对于

TextField

，它利用同一

图标的全局类名

CSS类作为

TextField

根（

和.MuiSelect图标

）的后代

从“React”导入React；
从“react dom”导入react dom；
从“@material ui/core/Select”导入选择；
从“@material ui/core/NativeSelect”导入NativeSelect；
从“@material ui/core/MenuItem”导入菜单项；
从“@material ui/core/styles”导入{withStyles}”；
从“@material ui/core/TextField”导入TextField；
const MySelect=with styles({
根目录：{
宽度：200
},
图标：{
颜色：“红色”
}
})（选择）；
const MyNativeSelect=带有样式({
根目录：{
宽度：200
},
图标：{
颜色：“紫色”
}
})（国家选举）；
const MyTextField=带样式({
根目录：{
“&.MuiSelect root”：{
宽度：200
},
“&.MuiSelect图标”：{
颜色：“蓝色”
}
}
})（文本字段）；
函数App（）{
返回(
挑选


选择本机


本地选民


文本字段选择


文本字段选择本机
);
}
const rootElement=document.getElementById（“根”）；
ReactDOM.render（
这正是我想要的。非常感谢
import React from "react";
import ReactDOM from "react-dom";
import Select from "@material-ui/core/Select";
import NativeSelect from "@material-ui/core/NativeSelect";
import MenuItem from "@material-ui/core/MenuItem";
import { withStyles } from "@material-ui/core/styles";
import TextField from "@material-ui/core/TextField";
const MySelect = withStyles({
  root: {
    width: 200
  },
  icon: {
    color: "red"
  }
})(Select);
const MyNativeSelect = withStyles({
  root: {
    width: 200
  },
  icon: {
    color: "purple"
  }
})(NativeSelect);
const MyTextField = withStyles({
  root: {
    "& .MuiSelect-root": {
      width: 200
    },
    "& .MuiSelect-icon": {
      color: "blue"
    }
  }
})(TextField);
function App() {
  return (
    <>
      <MySelect value="1">
        <MenuItem value="1">Select</MenuItem>
      </MySelect>
      <br />
      <MySelect native value="1">
        <option value="1">Select native</option>
      </MySelect>
      <br />
      <MyNativeSelect value="1">
        <option value="1">NativeSelect</option>
      </MyNativeSelect>
      <br />
      <MyTextField select value="1">
        <MenuItem value="1">TextField select</MenuItem>
      </MyTextField>
      <br />
      <MyTextField select SelectProps={{ native: true }} value="1">
        <option value="1">TextField select native</option>
      </MyTextField>
    </>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);