Vue 3 中 a-select 下拉框 onchange 事件监听示例
<template>
<a-select v-model:value="yncf.cfDoctor" show-search :filter-option="changeOption" style="width: 150px" @change="handleChange">
<a-select-option v-for="item in doctors" :key="item.pym" :value="item.id"> {{ item.employname }}</a-select-option>
</a-select>
</template>
<script>
export default {
data() {
return {
yncf: {
cfDoctor: null
},
doctors: [
{ id: 1, employname: 'Doctor 1' },
{ id: 2, employname: 'Doctor 2' },
{ id: 3, employname: 'Doctor 3' }
]
};
},
methods: {
handleChange(value) {
console.log('Selected doctor:', value);
},
changeOption(input, option) {
return option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0;
}
}
};
</script>
<p>在上述示例中,<code>@change</code> 事件绑定了 <code>handleChange</code> 方法,当下拉框的值发生变化时,会触发该方法,并将选中的值作为参数传递给方法。你可以根据需要在 <code>handleChange</code> 方法中进行相应的处理。</p>
原文地址: https://www.cveoy.top/t/topic/qwKg 著作权归作者所有。请勿转载和采集!