Reactjs 反应选择，无法更改文本框内占位符中文本的颜色

尝试将默认选择值的颜色设置为黑色，但不起作用，我甚至把它设置为黑色！重要信息，因此它会覆盖被它覆盖的任何引导颜色。谢谢你的帮助

const colourStyles = {
      control: styles => ({ ...styles, overflow: 'hidden', color: 'black !important',backgroundColor: this.state.selectedOption.value || '#32CD32', fontSize: 23,  paddingLeft: 'center', height:46}),
      singleValue: styles => ({ ...styles, color: 'black' }),
    }
<Select
 onChange={this.handleChange}
 options={optionsStatus}
 styles={colourStyles}
 placeholder= 'Status'
/> 

const colorstyles={
控件：styles=>（{…styles，overflow:'hidden'，color:'black！important'，backgroundColor:this.state.selectedOption.value | | |'#32CD32'，fontSize:23，paddingLeft:'center'，height:46}），
singleValue:styles=>（{…styles，颜色：'black'}），
}

---

我也遇到了这个问题。我一直在尝试更改css中的

：：占位符

，但它似乎被呈现为实际文本，而不是伪类。这是我发现的有效方法。首先，将prop

classnameprifix=“react select”

传递给组件，然后在css中使用以下命令选择它：

.react-select__placeholder {
  color: black;
}

---

（当然，您可以根据需要设置classNamePrefix）。

您可以使用相同的

颜色样式

对象更新占位符样式

const colourStyles = {
    placeholder: (defaultStyles) => {
        return {
            ...defaultStyles,
            color: '#ffffff',
        }
    }
}

---

您可以查看相关文档（）以检查可用于设置样式的键。

另一个选项是覆盖默认主题。根据docs的说法，neutral50表示占位符的颜色。例如：

<Select
    onChange={this.handleChange}
    options={optionsStatus}
    styles={colourStyles}
    placeholder= 'Status'
    theme={theme => ({
        ...theme,
        colors: {
            ...theme.colors,
            neutral50: '#1A1A1A',  // Placeholder color
        },
    })}
/>

({
主题
颜色：{
…主题。颜色，
neutral50:“#1A1A1A”，//占位符颜色
},
})}
/>

---

如果有人想要更改文本和样式，请查看

<Select 
options={options} 
placeholder={<div className="select-placeholder-text">Select category</div>} 
/>

可能重复的

.select-placeholder-text {
color: pink;
}