el
-select的
filter-method是用来自定义筛选选项的
方法。它接受一个函数作为参数，该函数在每次选项被过滤时被
调用。
filter-method函数接收两个参数：第一个参数是当前输入的关键字，第二个参数是当前选项。函数需要返回一个布尔值，用于判断该选项是否符合过滤条件。
下面是一个示例：
```html
<template>
<div>
<el
-select v
-model="selectedOption"
filterable :
filter-method="
filterOptions">
<el
-option v
-for="option in options" :key="option.value" :label="option.label" :value="option.value"></el
-option>
</el
-select>
</div>
</template>
<script>
export default {
data() {
return {
selectedOption: '',
options: [
{ value: '1', label: 'Option 1' },
{ value: '2', label: 'Option 2' },
{ value: '3', label: 'Option 3' },
{ value: '4', label: 'Option 4' }
]
}
},
methods: {
filterOptions(input, option) {
// 过滤条件为选项的label包含输入的关键字
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
}
}
}
</script>
```
上述示例中，我们使用了el
-select组件，并开启了
filterable属性，使得下拉选项可过滤。我们通过设置
filter-method属性为
filterOptions
方法来自定义过滤选项的方式。
filterOptions
方法中，我们通过判断选项的label是否包含了输入的关键字来决定该选项是否显示。如果包含了关键字，返回true，否则返回false。
这样，当我们在el
-select中输入关键字时，只有包含该关键字的选项会被显示出来，其他选项则会被过滤掉。
扫一扫
2486
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
