当前位置: 首页 > news >正文

解决element-ui的el-select使用filterable属性时,下拉框展开后,点击箭头图标收不回去问题

问题:当el-select下拉组件设置filterable属性时,下拉框展开后,再点击箭头图标下拉框收不回去了

在这里插入图片描述
解决方法:
在el-select标签上新增事件 @visible-change=“selectVisibleChange” @focus="selectFocus"的处理

<el-select 
	v-model="condition.eq.userId"
	placeholder="选择操作员"
	filterable 
	ref="selectTarget" 
	@visible-change="selectVisibleChange" 
	@focus="selectFocus"
 >
   <el-option
     v-for="(item, index) in userList"
     :key="index"
     :label="item.username"
     :value="item.userId"
   >
   </el-option>
 </el-select>
 
<script type="text/javascript">
export default {
  name: "Index",
  data() {
    return {
    	selectVisible:false
	}
  },
  methods:{
    selectVisibleChange(val) {
      setTimeout(() => {
        this.selectVisible = val
      }, 0)
    },
    selectFocus() {
      if (this.selectVisible) {
        this.$refs.selectTarget.blur()
      }
    }
  }
};
</script>

相关文章:

  • 【C/C++】合并两个有序链表 (leetcode T21)
  • QML ScrollBar如何一直保持到最底部
  • 【C语言】fgetpos函数用法介绍
  • C# 中DevExpress的GridView中Appearance 属性
  • 搅局外卖,京东连出三张牌
  • Selenium实战案例2:东方财富网股吧评论爬取
  • 解决 Plugin ‘org.springframework.boot:spring-boot-maven-plugin:‘ not found
  • Prompt:创造性的系统分析者
  • 前端面试之Box盒子布局:核心知识与实战解析
  • 单调栈刷题
  • 1.21作业
  • 除了Axios,如何用fetch处理403错误?
  • 懒人美食帮(springboot论文源码调试讲解)
  • 【记录55】多个参数查询,无用参数不记查询
  • go 通过ssh连接linux golang.org/x/crypto/ssh
  • 网络安全设备防护原理 网络安全防护装置
  • WARNING: pip is configured with locations that require TLS/SSL
  • C语言的指针常量、常量指针、指针函数、函数指针的区别
  • 去中心化协作智能生态系统设计
  • 【Flink实战】Flink网络内存和托管内存
  • 无人机企业从科技园区搬到乡村后,村子里变得不一样了
  • 江苏疾控:下设部门无“病毒研究所”,常荣山非本单位工作人员
  • 男子聚餐饮酒后身亡,同桌3人被判赔偿近20万元
  • “先增聘再离任”又添一例,景顺长城基金经理鲍无可官宣辞职
  • 俄乌谈判开始
  • 打击网络侵权盗版!四部门联合启动“剑网2025”专项行动