React-select.Async 不会在 onClick 上加载选项

React-select.Async doesn't load options on onClick

我需要一个异步反应-select,它将从后端加载选项,用户将能够select多个选项。但是,当输入值已经输入并且用户单击 select 时,输入选项不会被加载。它们仅在您输入内容时加载。

Example code sandbox

Input value stays the same

编辑:回答

要重新加载默认选项,您需要将 defaultOptions 传递给 Async select,而不仅仅是 true。这可以通过在 componentDidMount 中将 defaultOptions 设置为 state 并在 onInputChange 中侦听 'menu-close' 操作并将 defaultOptions 设置为 state 来完成。这将确保在安装组件时默认选项将在那里,并且当菜单关闭时,将使用新的 inputValue 重新获取选项。

要让 react-select 自动加载内容,您必须提供 defaultOptions 属性。如果您不自动加载,那么在他们尝试过滤之前它不会进行异步调用。

<AsyncSelect loadOptions={myAsyncMethod} defaultOptions />

要重新加载默认选项,您需要将 defaultOptions 传递给 Async select,而不仅仅是 true。这可以通过在 componentDidMount 中将 defaultOptions 设置为 state 并在 onInputChange 中侦听 'menu-close' 操作并将 defaultOptions 设置为 state 来完成。这将确保在安装组件时默认选项将在那里,并且当菜单关闭时,将使用新的 inputValue 重新获取选项。

Working example