reactjs - 在 React-Select 中获取选定的值

我正在尝试实现 this example that obtains the user selected value, 但使用异步选择版本。

我想获取用户选择的值，但是通过 react-select 上的文档并不清楚该怎么做。如果您将 state 设置为等于 inputValue，那么只要您单击“提交”按钮，inputValue 就会被清除。你回来
" "
代替
user selected value
我不确定如何使用异步选择组件获取用户选择的值。我的 API 数据已成功填充和过滤建议框，但我不知道如何获取所选值。

我尝试了多种方法，最后尝试使用上面链接中的 refs 方法，但存储的值显示为空。而不是存储用户选择的值。 Here is the link to my broken codesandbox 。

任何人都可以帮助或指出我正确的方向吗？

编辑

Here is a link to a working demo 如果将来有人陷入困境。

最佳答案

所以，你弄错的是 react-select 的 Prop 来获取变化的值(value)。在 onChange 组件上使用 onInputChange 而不是 AsyncSelect。两种 Prop 都有不同的用途。这是可用于 react-select 的所有 Prop 的文档。 https://react-select.com/props
试试下面的代码

textChange = inputValue => { // whole object of selected option
    this.setState({ inputValue:inputValue.value });
};

render(){
....
        <AsyncSelect
          defaultOptions
          loadOptions={this.promiseOptions}
          onChange={this.textChange} /** onChange triggers only when user change the
           options but onInputChange triggers on each change which is for different
           purpose like for e.g. when user type, fetch similar options **/
          name="options"
        />
}

关于reactjs - 在 React-Select 中获取选定的值，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/58003801/