antd select如何支持既能输入不存在的选项又能进行下拉框选择

最新推荐文章于 2024-09-19 17:22:14 发布

Alan Zhang

最新推荐文章于 2024-09-19 17:22:14 发布

阅读量7.7k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： react

本文链接：https://blog.youkuaiyun.com/weixin_44437473/article/details/89382150

react 专栏收录该内容

4 篇文章

订阅专栏

本文深入解析React中Select组件的配置与使用，涵盖onSearch、onBlur及onChange属性的应用技巧，结合实例阐述如何通过状态管理提升组件交互体验。

1.Select必须具备onSearch,onBlur,onChange这三个属性;
<Select
showSearch
value={this.state.value}
onSearch={…}
onBlur={…}
onChange={…}

{optionsFor}

2.在onSearch中使用回调，并设置state {this.setState({ 'newState':val })}} onBlur={} onChange={...} > {optionsFor} 3.onChange设置回调 {this.setState({ 'newState':val })}} onBlur={} onChange={this.handleChange} > {optionsFor} 3.onBlur中利用三目判断，并返回输入的值 {this.setState({ 'newState':val })}} onBlur={()=>{ return this.state.newState?this.handleChange:null }} onChange={this.handleChange} > {optionsFor} 4.最后一步，也是最重要的，必须利用delete命令移除在state中设置的newState； let finalState = this.state; delete newState['newState]; this.setState({finalState})