解决方式①:参考连接:(亲测有用)【element-select】添加过滤属性以及@change后下拉框异常_element select过滤时,不收起下拉框_Y.哈哈的博客-CSDN博客
1、添加过滤属性后点击下箭头不收起下拉框
2、@change通过dialog触发事件后,下拉框不关闭
在App.vue的created钩子中添加代码
Object.getPrototypeOf(this.$options.components).ElSelect.options.methods.handleFocus = (event) => {}
解决方式②:参考链接:(没亲测)element ui el-select点击图标无法关闭下拉框问题_el-select选择后弹窗,下拉框不会关闭_时光荏苒、、、、、、、、的博客-CSDN博客
<template>
<el-select v-model="value" filterable placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
ref="select"
:label="item.label"
@visible-change="visibleChange"
@focus="focus"
:value="item.value">
</el-option>
</el-select>
</template>
<javascript>
data(){
return:{
inputFlag:null
}
},
methods:{
focus() {
if (this.inputFlag) {
this.$refs.select.blur()
}
},
visibleChange(val) {
setTimeout(() => {
this.inputFlag = val
}, 0)//让其异步,不然可能会先执行visibleChange 后执行focus,就会有bug
},
}
</javascript>