背景:

1.在做我的项目的时候,常常应用antd中”多选的select组件“;

2.antd KPI文档写的:showSearch 使单选模式可搜寻,意为在单选时,搜寻性能是能够设置的,当showSearch:false,在多选模式仍有搜寻性能。

3.导致多选模式输入框会获取焦点光标呈现,并且还可输出内容,因为选项的value是值的code不是label,所以输出内容搜寻会找不到相干内容。
<Select mode={'multiple'}/>



解决办法:

1.针对antd 3.x 的select组件: 进行dom操作,找到该input,增加只读属性

js
// antd 下拉组件 多选模式 不反对禁用输出搜寻性能, 通过dom操作禁用输出性能const auctionTimesCode = document.querySelector('#auctionTimesCode #auctionTimesCode');auctionTimesCode && auctionTimesCode.setAttribute('readonly', 'true');
css
.ant-select-selection--multiple {  cursor: pointer;}

2.针对antd 4.x 的select组件: showSearch:false 居然能够了????????,看来是antd文档没有更新。

<Select mode={'multiple'} showSearch={false}/>

结语:

之前为了解决antd3.x查了很多材料,的确是antd3中select组件没有对多选模式下搜寻性能可禁用配置,整理出来此文档心愿对正在苦恼的小伙伴提供帮忙。