Question

我在我的React应用程序选择字段中使用React-Select库。我具有添加和编辑数据的相同表格。如果我不提供任何值，则可以正常工作，但是如果我想在应用程序渲染时使用默认值，则无法更改它们。它们显示为选中状态，但是如果我尝试选择其他选项，它只是不会更新，而我在//init state this.state = { chartData: [], } //service inside componentDidMount axios.get('https://api.coingecko.com/api/v3/coins/markets?vs_currency=usd&order=market_cap_desc&per_page=2&page=1&sparkline=true') .then(res => { const x = res.data; let chartData = []; x.forEach(element => { chartData.push({ labels: element.sparkline_in_7d.price, datasets:[{data: element.sparkline_in_7d.price}] }); }); this.setState({chartData}); })道具中提供的值仍然保持选中状态。

我尝试使用value代替defaultValue，但是当应用程序渲染时，它什么也没选择。

value

<Select placeholder="Deposit" options={deposits} getOptionValue={ option => option["id"] } getOptionLabel={ option => { return option["name"]; }} onChange={ value => { this.setState({ deposit_id: value.id }} value={{ value: deposit_id || "", name: deposit_name || "" }} />是一个对象数组，它呈现名称列表，但是当我单击其中的一个时，我在deposits中提供的名称将保持选中状态，但应选择我点击的那一个...如何更改？我的value函数有问题吗？还是我做错了什么？

Answer 1

正确的格式是使用值/标签键：

value={{ value: 'vanilla', label: 'Vanilla' }}

Answer 2

尝试以下代码。值props应该是字符串，即状态的值。

<Select 
    placeholder="Deposit"
    options={deposits}
    getOptionValue={ option =>
        option["id"]
    }
    getOptionLabel={ option => {
        return option["name"];
    }}
    onChange={ value => {
        this.setState({ deposit_id: value.id }}
    value={deposit_id}
/>

无法更改反应选择文件的值

2 个答案: