javascript - 如何更改 Material-UI Select Field HR 元素的颜色？

Question

您好，我的网站上有这个 Select Field 组件，我正在使用 Material-UI。我试图覆盖样式以更改它生成的 hr，默认情况下为浅灰色。它与我的背景融合得太多，很难看清。哪个属性来自http://www.material-ui.com/#/components/select-field我可以用它来实现吗？我已经尝试了几乎所有与样式相关的方法，但我只是不知道如何更改选择字段的这一特定部分。我已经通过在 React 中添加以下代码来更改图标:

  iconStyle: {
    fill: '#000000'
  }

  <SelectField value={this.state.selectedvalues.priority}
  onChange={this.priorityHandleChange} floatingLabelText="Priority"
  iconStyle={this.props.iconStyle}>

但我一辈子都想不出如何覆盖它正在创建的 hr 元素。

Answer 1

这会将所有文本、图标(下拉指示器)和下划线的颜色更改为相同的颜色:

<SelectField
  underlineStyle={{ borderColor: '#ff0000' }}
  iconStyle={{ fill: '#ff0000' }}
  labelStyle={{ color: '#ff0000' }}
>....</SelectField>

这是 JSX，所以在普通的 js/css 中它不是驼峰式大小写。而不是 borderColor 它是 border-color