问题: 在最近一个项目中,我需要使用到antDesign中的下拉搜索组件,但是在下拉组件选择某项后,需要有事件处理,根据组件使用,发现默认传参是有两个,我还需要再传两个自己的参数,这样该如何处理呢?
组件代码如下:
<a-select
v-model:value="dataItem[child.field]"
show-search
placeholder="请输入"
style="width: 100%"
:filter-option="filterDrugOption"
:options="drugOptions"
@change="handleChange"
>
</a-select>
……
const handleChange = (input: string, option: any) => {
return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0; };
简要说明:在这里,show-search属性是搜索功能,data是数据源 在@filterOption事件里面,可以看到默认是有input 和 option两个参数的,这时,我们还想多传其他参数的话,就要用到闭包传参了。
事件定义:
@change="
(...val) => {
return handleChange(
...val,
你的其他参数
);
}
"
对应事件:
handleChange(input, option, field, index) {
console.log(
input,
option,
'---我的参数---',
field,
index
);
return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0;
},
这样就可以解决啦!