背景

记录一下
大屏项目中,下拉数据过多,想使用下拉搜索功能;
输入汉字,匹配对应的项目;

解决方案

关键代码如下:
a-select控件


			<a-select
                v-model:value="state.schemeInfo.monitorList"
                show-search
                :options="state.monitorOptions"
                :filter-option="monitorFilterOption"
                @change="onSelectIndex"
              ></a-select>

projectFilterOption 匹配事件

const projectFilterOption = (input: string, option: any) => {
  const label = state.polderOptions.find(item => item.value === option.value)?.label || ''
  // 根据label来过滤
  return label.toLowerCase().includes(input.toLowerCase())
}
03-21 03:02