el-select 中加了filterable 点击箭头下拉框回收不去问题

news2025/1/8 1:04:40

在这里插入图片描述

 

解决方式①:参考连接:(亲测有用)【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>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/819935.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

新能源光学膜厚测量仪

能源是人类社会可持续发展的动力源泉和重要生存基础。近年来&#xff0c;新能源的研究受到世界各国的高度重视&#xff0c;包括太阳能、风能和潮汐能等在内的可再生能源正在成为传统化石燃料有希望的替代品&#xff0c;因此&#xff0c;开发低成本、大规模的能源转换技术与新型…

【laravel+vue2 】医院信息化手术麻醉临床信息管理系统源码

近年来&#xff0c;医院信息化成为医院领域的推广重点&#xff0c;HIS、LIS、PACS、EMR等信息系统的相继出现&#xff0c;显著提高了医院业务的运行效率。手术麻醉系统作为医院信息系统的一部分&#xff0c;由监护设备数据采集系统和麻醉信息管理系统两个子系统组成。 一、医院…

【LeetCode】【数据结构】单链表OJ常见题型(一)

&#x1f440;樊梓慕&#xff1a;个人主页 &#x1f3a5;个人专栏&#xff1a;《C语言》《数据结构》《蓝桥杯试题》《LeetCode刷题笔记》 &#x1f31d;每一个不曾起舞的日子&#xff0c;都是对生命的辜负。 目录 前言&#xff1a; 【LeetCode】203.移除链表元素 【LeetCo…

不同语言操作符的优先级

看到标题&#xff0c;可能会心生疑惑: 这么基础且重要的操作&#xff0c;不同语言不应该是一致的吗&#xff1f; 并不一定&#xff0c;比如对于右移运算和加法运算&#xff0c;Go就与其他多数语言表现得不一致&#xff1a; Go: package mainimport "fmt"func main() …

解密Redis:应对面试中的缓存相关问题

文章目录 1. 缓存穿透问题及解决方案2. 缓存击穿问题及解决方案3. 缓存雪崩问题及解决方案4. Redis的数据持久化5. Redis的过期删除策略和数据淘汰策略6. Redis分布式锁和主从同步7. Redis集群方案8. Redis的数据一致性保障和高可用性方案 导语&#xff1a; 在面试过程中&#…

社区说|Flutter 一知半解,带你拨云见月

Hello&#xff0c;大家好&#xff0c;我是 Flutter GDE 郭树煜&#xff0c;今天的主题是科普向的分享内容&#xff0c;主要是带大家更全面的去理解 Flutter &#xff0c;尽可能帮助大家破除一些误解&#xff0c;分享内容不会特别长&#xff0c;但是应该会帮助你从新认识下 Flut…

C++源码使用make生成动态库和静态库

我这个新电脑&#xff0c;没装Homebrew&#xff0c;把这个复制进终端安装。 /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" 下载过程如下所示

blender凹凸感和置换形变

一、怎么做出凹凸感 需要三个部分的内容&#xff1a; 1、一个基础的纹理&#xff1a;告诉计算机需要用一个什么样的纹理做凹凸&#xff0c;纹理一般采用黑白&#xff0c;在计算机里面&#xff0c;从 0 - 1之间的值可以用从黑到白之间不同的灰度来表示因此&#xff0c;有一张黑白…

char类型到底是有符号还是无符号的?

最近在整理代码时&#xff0c;发现有一些如下类型的警告&#xff1a; ..\XXXXX\XXXXX.c(224): warning: #186-D: pointless comparison of unsigned integer with zero 这个警告的意思是无符号数与0比较是无意义&#xff0c;而我报警告的代码行如下&#xff1a; char len_v…

阿里用户序列建模ETA

End-to-End User Behavior Retrieval in Click-Through Rate Prediction Model 摘要 现实很少有工作可以处理长序列用户建模的问题&#xff0c;SIM提出了两阶段方法。第一阶段&#xff0c;辅助任务旨在从长序列用户行为检索最相关的用户行为序列。第二阶段&#xff0c;经典的…

位图和 DC 有什么特别之处?

相信设备上下文 (DC, Device Context) 对你来说&#xff0c;应该很熟悉。 基本工作方式是&#xff0c;你可以通过调用 SelectObject 来将画笔(Pen)&#xff0c;画刷(Brush)&#xff0c;字体(Font)和位图(Bitmap)等这些对象选入设备上下文中&#xff0c;但是&#xff0c;这里的位…

Android 面试题 应用程序结构 十一

&#x1f525; Framework主要包含以下模块 &#x1f525; ActivityManagerService 这是一个Activity的管理者&#xff0c;负责管理所有Activity的生命周期。WindowManagerService 它是手机屏幕的的管理者&#xff0c;管理着屏幕的详细情况&#xff0c;所有对屏幕的操作最终都…

ChatGPT学python——制作自己的AI模型(一)初步了解

前言 「作者主页」&#xff1a;雪碧有白泡泡 「个人网站」&#xff1a;雪碧的个人网站 「推荐专栏」&#xff1a; ★java一站式服务 ★ ★前端炫酷代码分享 ★ ★ uniapp-从构建到提升★ ★ 从0到英雄&#xff0c;vue成神之路★ ★ 解决算法&#xff0c;一个专栏就够了★ ★ 架…

2023国际先进制造青年科学家大会圆满结束!易知微受邀进行数字孪生主题报告分享

2023年7月30日&#xff0c;以“新青年&#xff0c;新视野&#xff0c;新制造”为主题的2023国际先进制造青年科学家大会在浙江绍兴开幕&#xff0c;旨在强力推进创新深化改革攻坚开放提升&#xff0c;进一步做强“人才&#xff0b;产业”双联驱动、人才集聚与产业发展共振同兴&…

NLP/CV相关模型库-阿里

模型库地址&#xff1a;https://www.modelscope.cn/models

30岁转行学编程,更容易成功

“男人30而立&#xff0c;我没有退路&#xff0c;只有选择勇往直前&#xff0c;这样我才能无所畏惧&#xff0c;因为我希望在我的人生篇章里&#xff0c;能拥有浓墨重彩的一笔&#xff01;” 30岁&#xff0c;在经历一番“打击”后毅然决然选择学编程&#xff0c;为家人也为自…

解决Mysql报错2003 (HY000): Can‘t connect to MySQL server on ‘localhost‘ (10061)

1.找到mysql文件夹&#xff0c;将my,ini文件放入bin文件夹 2.管理员模式打开cmd 3.输入netstat -ano查看端口占用情况&#xff0c;这里我已经开启mysql应用&#xff0c;所以会有3306&#xff0c;如果没有开启是不会有的 4.输入sc delete mysql&#xff0c;删除mysql服务 5.将…

Vue如何实现重定向

在刚登录之后&#xff0c;我们想要默认展示一下用户登录&#xff0c;这个功能如何实现&#xff1a; 就是重定向为/home/user这个值 我们就是在/home 上加一个重定向 具体怎么做那&#xff0c;先找到/home的路由规则 想要实现重定向,增加一个redirect就行

基于SpringBoot+Vue的广场舞团管理系统设计与实现(源码+LW+部署文档等)

博主介绍&#xff1a; 大家好&#xff0c;我是一名在Java圈混迹十余年的程序员&#xff0c;精通Java编程语言&#xff0c;同时也熟练掌握微信小程序、Python和Android等技术&#xff0c;能够为大家提供全方位的技术支持和交流。 我擅长在JavaWeb、SSH、SSM、SpringBoot等框架…

无涯教程-Lua - 环境安装

在Windows上安装 为Windows环境开发了一个单独的名为" SciTE"的IDE,可以从https://code.google.com/p/luaforwindows/下载部分。 运行下载的可执行文件以安装Lua IDE。 由于它是一个IDE&#xff0c;因此您可以使用它来创建和构建Lua代码。 如果您有兴趣在命令行模…