react-select 没有正确设置 defaultValue 参数

Question

所以我有这段代码，但它没有正确设置默认值，这是 patchsOptions[0] 的值：

console.log(patchOptions[0]); // Object { value: "10.15.1", label: "10.15.1" }

<Select
    className="col-2"
    placeholder="Patch"
    defaultValue={patchsOptions[0]}
    options={patchsOptions}
    onChange={option => this.onChangePatch(option.value)}
/>

默认值保持为空，但选项加载正确，所以我没有看到问题，因为看了一些例子，它也使用了“options[0]”变量。

通过以这种方式更改代码，它按预期工作：

<Select
    className="col-2"
    placeholder="Patch"
    defaultValue={{ value: 'test', label: 'test' }}
    options={patchsOptions}
    onChange={option => this.onChangePatch(option.value)}
/>

他们都有相同的obj结构，所以我没明白问题出在哪里。我记录了渲染前的默认值，设置正常，不为空。

Answer 1

由于 patchesOptions 是通过异步调用设置的，因此第一次渲染时它将为 null，如果更改它的值，默认值也不会更改，这就像一个初始值，所以您可以做什么是使用值选项，link它到selectedPatch，我也做了一些改变（onChange）像这样：

<Select
    className="col-2"
    placeholder="Patch"
    value={{this.state.selectedPatch.value, this.state.selectedPatch.label}}
    options={patchsOptions}
    onChange={option => this.onChangePatch(option)}
/>

react-select 没有正确设置 defaultValue 参数

react-select not setting defaultValue param properly

reactjs

react-select