当状态更新时，我们也想更新 React-Select 的 defaultValue

Question

我想显示ReactSelect的defaultValue中的默认值，但是状态更新时，defaultValue没有更新。默认显示不更新。

如何避免这种现象？如果您能告诉我更多相关信息，我将不胜感激。

constructor(props) {
        super(props)
        this.state = {
            item: props.item,
        };
    }

const set = { label: this.state.item.name, value: this.state.item.id }

<Select
    options={groupOptions}
    defaultValue={set}
/>

Answer 1

我相信 defaultValue 是您的初始值。要更新您需要将新的 set 传递给 value

<Select
    options={groupOptions}
    defaultValue={set}
    value={set}
    />

Answer 2

你只是缺少 value 道具，你还需要 onChange 道具

<Select
    options={groupOptions}
    defaultValue={set}
    value={set}
    onChange={e=>{
        const value =e.target.value
        //set state here 
     }}
/>

Answer 3

将 value 作为 prop 传递。

代码如下：

    <Select
      name="something"
      options={groupOptions}
      defaultValue={set}
      value={set}
      onChange={(e) => inputChangeHandler(e.target.value)}
    />

注意: inputChangeHandler 函数将更新 state.

编码愉快:)

当状态更新时，我们也想更新 React-Select 的 defaultValue

When the state is updated, we want to update the defaultValue of React-Select as well

reactjs

react-select