是否可以在react select（ReactJS）上更改字体颜色？

我有一个按钮，当点击时，所有内容都是透明的

是否可以手动设置文本颜色？不是背景色

我希望我的字体上的黑色不是透明的

我的代码：

import React from 'react';
import DatePicker from "react-datepicker";
import Select from 'react-select';

import "react-datepicker/dist/react-datepicker.css";
import 'react-datepicker/dist/react-datepicker-cssmodules.css';

const options = [
    { value: 'chocolate', label: 'Chocolate' },
    { value: 'strawberry', label: 'Strawberry' },
    { value: 'vanilla', label: 'Vanilla' },
];



class Test extends React.Component {

    state = {
        startDate: new Date(),
        selectedOption: null,
    }

    constructor() {
        super();

        this.state = {

        };
    }

    handleChange = date => {
        this.setState({
            startDate: date
        });
    };

    handleChange = selectedOption => {
        this.setState({ selectedOption });
        console.log(`Option selected:`, selectedOption);
    };

    render() {
        const { selectedOption } = this.state;

        return (

            <div className="grid-container">
                <DatePicker
                    selected={this.state.startDate}
                    onChange={this.handleChange}
                    dateFormat="yyyy-MM-dd"
                />
                <Select
                    value={selectedOption}
                    onChange={this.handleChange}
                    options={options}

                />
            </div>
        );
    }
}


export default Test;

从“React”导入React；
从“反应日期选择器”导入日期选择器；
从“反应选择”导入选择；
导入“react datepicker/dist/react datepicker.css”；
导入'react datepicker/dist/react datepicker cssmodules.css'；
常量选项=[
{值：'chocolate'，标签：'chocolate'}，
{值：'草莓'，标签：'草莓'}，
{值：'香草'，标签：'香草'}，
];
类测试扩展了React.Component{
状态={
开始日期：新日期（），
selectedOption:null，
}
构造函数（）{
超级（）；
此.state={
};
}
handleChange=日期=>{
这是我的国家({
开始日期：日期
});
};
handleChange=selectedOption=>{
this.setState（{selectedOption}）；
log（`Option selected:`，selectedOption）；
};
render（）{
const{selectedOption}=this.state；
返回(
);
}
}
导出默认测试；

但是没有成功

---

单击按钮时，我希望数据以黑色字母显示在白色背景上。

您可以通过以下方式找到要定位的类：在浏览器元素检查器中找到元素并找到其类。您可以通过添加以下内容来修改其类：

.putElementClassNameHere {
 color: black !important;
}

---

你可能需要！对于要应用的样式很重要。

您可以通过以下方式找到要定位的类：在浏览器元素检查器中找到元素并找到其类。您可以通过添加以下内容来修改其类：

.putElementClassNameHere {
 color: black !important;
}

---

你可能需要！对于要应用的样式很重要。

react select

是以一种您应该在JS中使用

CSS的方式构建的，而不是像这里描述的那样使用
CSS

然后，您将能够使用一些造型道具，如：

const customStyles = {
  option: provided => ({
    ...provided,
    color: 'black'
  }),
  control: provided => ({
    ...provided,
    color: 'black'
  }),
  singleValue: (provided) => {
    ...provided,
    color: 'black'
  }
}

等等。
react select
是以一种您应该在JS中使用
CSS的方式构建的，而不是像这里描述的那样使用
CSS

然后，您将能够使用一些造型道具，如：

const customStyles = {
  option: provided => ({
    ...provided,
    color: 'black'
  }),
  control: provided => ({
    ...provided,
    color: 'black'
  }),
  singleValue: (provided) => {
    ...provided,
    color: 'black'
  }
}

等等