我在我的项目中使用react-select 2。每次用户选择一个选项时,都会清除输入值,这会导致选项列表发生变化。 有没有办法保留输入值,以便用户可以选择多个选项?这是我试过的:
<Select
closeMenuOnSelect={false}
blurInputOnSelect={false}
isMulti
loadOptions={this.resultProvider.bind(this)}
inputValue={this.state.searchKey}
onInputChange={this.handleInputChanged.bind(this)}
/>
handleInputChanged(input, reason) {
if (reason.action === "set-value") {
return;
}
this.setState({
...this.state,
searchKey: input
});
}
我创建了一个演示来演示这个问题:https://codesandbox.io/s/345rp0m041
请注意,此问题仅适用于Async select。
谢谢你的建议!
我觉得你很亲密。解决此问题的一种快速方法(可能不是最好的方法)是在handleInputChanged
方法中再添加两个检查:
handleInputChanged(input, reason) {
if (reason.action === "set-value" ||
reason.action === "input-blur" ||
reason.action === "menu-close") {
return;
}
this.setState({
...this.state,
searchKey: input
});
}
这是您的代码的工作演示:https://codesandbox.io/s/8n9mx057k0
希望这可以帮助!
旁注:在V1 of react-select中,我们使用onSelectResetsInput
prop来保留用户选择选项时输入框的值。但似乎已经不再可用了