在使用react-select更改为黑色时尝试更改默认占位符的颜色不起作用

Question

该文本当前为灰色，很难看到，我想将其设置为黑色，以便于注意。每当我更改选择值时，它都会更改，但是当我尝试将控件文本的默认颜色设置为黑色时，它什么也没做。我的其他设置也可以使用，例如backgroundColor和fontfamily可以使用。

渲染时，我正在将占位符值设置为我的状态。

const colourStyles = {
  control: styles => ({ ...styles, fontFamily: 'Times new roman, sans-serif !important', color: 'black',  backgroundColor: this.state.selectedOption.value || this.state.statusLiveOff, fontSize: 23,  paddingLeft: 'center', height:46})
}
<Select
   onChange={this.handleChange}
   options={optionsStatus}
   styles={colourStyles}
   placeholder= {this.state.statusColor}
 /> 

Answer 1

您可以通过更改样式对象中的singleValue样式来更改文本的颜色

const colourStyles = {
  control: styles => ({ ...styles, fontFamily: 'Times new roman, sans-serif !important', color: 'black',  backgroundColor: this.state.selectedOption.value || this.state.statusLiveOff, fontSize: 23,  paddingLeft: 'center', height:46}),
  singleValue: styles => ({...styles, color: 'black'})
}