element ui el-select点击图标无法关闭下拉框问题

element ui el-select点击图标无法关闭下拉框问题

当el-select设置了filterable 筛选的时候 点击图标无法关闭下拉框
思路：利用visible-change方法获取下拉框打开和关闭事件，然后focus方法拿到鼠标事件

上代码：

<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>

完美解决，亲测！点点关注谢谢