如何禁用点击select组件时的搜索功能

针对主流UI组件库，以下是具体的配置方案：

Element UI（Vue） #

直接将filterable属性设为false即可关闭搜索功能（默认该属性为false，若之前手动开启过，改回false即可）：

<el-select v-model="value" :filterable="false">
  <el-option label="选项1" value="1"></el-option>
  <el-option label="选项2" value="2"></el-option>
</el-select>

Ant Design（React/Vue） #

通过showSearch属性控制，设为false禁用搜索：

// React示例
<Select showSearch={false} value={value} onChange={handleChange}>
  <Option value="1">选项1</Option>
  <Option value="2">选项2</Option>
</Select>

// Vue示例
<a-select :show-search="false" v-model="value">
  <a-select-option value="1">选项1</a-select-option>
  <a-select-option value="2">选项2</a-select-option>
</a-select>

Bootstrap Select #

添加data-live-search="false"属性来禁用搜索：

<select class="selectpicker" data-live-search="false">
  <option>选项1</option>
  <option>选项2</option>
</select>

如果是自定义或小众组件库，通常可以查找组件文档中类似filterable、showSearch、enableSearch这类命名的属性，将其设置为false即可关闭搜索功能。

内容的提问来源于stack exchange，提问作者user2150463