Ant Design select多选时禁止输入只能从下拉框中选择用了很久Ant Design select 才发现多选

背景

在做项目的时候，经常使用antd中”多选的select组件“；

antd KPI文档写的：showSearch 使单选模式可搜索，意为在单选时，搜索功能是可以设置的，当showSearch：false，在多选模式仍有搜索功能。
导致多选模式输入框会获取焦点光标出现，并且还可输入内容，由于选项的value是值的code不是label，所以输入内容搜索会找不到相关内容。

目的

多选模式下选择框不可输入

解决

1.针对antd 1.x 的select组件: 通过修改组件CSS

html

css

.my_select_component {
  /deep/.ant-select-search__field__wrap {
    display: none !important;
  }
  /deep/ .ant-select-selection--multiple{
    cursor: pointer !important;
  }
}

2. 针对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;
}

3. 针对antd 4.x 的select组件: showSearch:false 竟然可以了📣😍，看来是antd文档没有更新。