antdv 选择（Select ）组件实现模糊搜索

最新推荐文章于 2024-07-01 16:41:08 发布

原创最新推荐文章于 2024-07-01 16:41:08 发布 · 1.8k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#vue

收录于

Vue.js 专栏收录该内容

6 篇文章

订阅专栏

antdv API地址：
https://www.antdv.com/components/select-cn/#API

上代码

template

<template>
	<a-select showSearch :filterOption="filterOption">
          <a-select-option :value="item.value" :title="item.label" v-for="(item, index) in options"
            :key="index">
            {{ item.label }}
          </a-select-option>
        </a-select>
</template>

script

...
data() {
	return {
		options: [],
        filterOption: (input, option) => {
            // label搜索
            return option.componentOptions.propsData.title.indexOf(input) > -1
        }
	}
}