el-select与treeselect下拉框重叠、兼容性问题

news2024/9/29 17:33:06

 问题描述:

        点击el-select的外部,el-select下拉框会自动收回,此操作触发了el-select的clickoutside事件,但当el-select与treeselect配合使用时,先点击el-select使下拉框出现,后再点击treeselect,此时el-select下拉框没有收回,且treeselect的下拉框同时出现。

解决办法:

        为el-select标签绑定一个ref,再在treeselect中通过open事件操作el-select组件的blue事件。

@open="$refs.select.blur()"
ref="select"

代码如下:

<el-col :span="24">
  <el-form-item label="组织名称" prop="unitId">
    <treeselect
      @open="$refs.select.blur()"
      v-model="form.unitId"
      :options="deptOptions"
      :show-count="true"
      placeholder="请选择组织名称"
      @select="riskPersonDeptChangeValue"
    />
  </el-form-item>
</el-col>
<el-col :span="24">
  <el-form-item label="征兵年度" prop="years">
    <el-select
      ref="select"
      v-model="form.years"
      placeholder="请选择征兵年度"
      style="width: 100%;"
      @change="getAttribute()"
    >
      <el-option
        v-for="res in yearsList"
        :key="res.key"
        :label="res.value"
        :value="res.key">
      </el-option>
    </el-select>
  </el-form-item>
</el-col>

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

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

相关文章

浅谈 USB Bulk 深入浅出 (3) - USB Bulk 装置传输的注意事项

来源&#xff1a;大大通 作者&#xff1a;冷氣團 1 USB Bulk 是什么 USB 是即插即用使用差动信号的装置界面&#xff0c;是以 端点 ( Endpoint )&#xff0c;做为传输装置的输出入端&#xff0c;透过不同的端点 ( Endpoint ) 和模式&#xff0c;来进行与装置的沟通&#xff…

极狐在广告推广与客服系统中实现API集成,加快电商平台无代码开发进程

无代码开发&#xff1a;电商平台的新时代 随着科技的进步&#xff0c;电商平台正经历着一场变革&#xff0c;那就是无代码开发的兴起。在这个新时代里&#xff0c;企业不再需要耗费大量的时间和资源来进行繁杂的API开发。极狐GitLab作为一站式DevOps平台&#xff0c;提供了这样…

【C语言】动态内存规划# 这一篇就够了

目录 通过本篇文章&#xff0c;你可以了解到&#xff1a; &#xff08;O&#xff09;C/C中程序内存区域划分 &#xff08;一&#xff09;动态内存分配的作用 (二)动态内存函数的原理与使用 1.内存开辟malloc 2.初始并开辟calloc 3.调整已开辟的内存realloc 4.释放空间free …

TMTS汽车电子仿真及测试研讨会笔记请查收!

11月29日&#xff0c;德思特2023年度TMTS汽车电子仿真及测试研讨会圆满结束。感谢大家的观看与支持&#xff01; 在直播间收到一些观众的技术问题&#xff0c;我们汇总了热点问题并请讲师详细解答&#xff0c;在此整理分享给大家&#xff0c;请查收&#xff01; 面向汽车T-BOX…

2023年最佳推荐 | 值得收藏的 5大 SaaS 知识库

随着数字化时代的到来&#xff0c;SaaS&#xff08;软件即服务&#xff09;已经成为企业和个人日常工作中的重要工具。在众多的SaaS应用中&#xff0c;知识库是不可或缺的一部分&#xff0c;它可以帮助我们更好地管理和利用知识&#xff0c;提高工作效率和创新能力。接下来就跟…

小型洗衣机什么牌子好又便宜?内衣洗衣机品牌排行榜前十名

最近这两年在洗衣机中火出圈的内衣洗衣机&#xff0c;它不仅可以清洁我们较难清洗的衣物&#xff0c;自带除菌功能&#xff0c;可以让衣物上的细菌&#xff0c;还能在清洗的过程中呵护我们衣物的面料&#xff0c;虽然说它是内衣洗衣机&#xff0c;它的功能不止可以清洗内衣&…

LED恒流调节器FP7125,应用LED街道照明、调光电源、汽车大灯、T5T8日光灯

目录 一、FP7125概述 二、FP7125功能 三、应用领域 近年来&#xff0c;随着人们环保意识的不断增强&#xff0c;LED照明产品逐渐成为照明行业的主流。而作为LED照明产品中的重要配件&#xff0c;LED恒流调节器FP7125的出现为LED照明带来了全新的发展机遇。 一、FP7125概述 FP…

工业应用新典范,飞凌嵌入式FET-D9360-C核心板发布!

来源&#xff1a;飞凌嵌入式官网 当前新一轮科技革命和产业变革突飞猛进&#xff0c;工业领域对高性能、高可靠性、高稳定性的计算需求也在日益增长。为了更好地满足这一需求&#xff0c;飞凌嵌入式与芯驰科技&#xff08;SemiDrive&#xff09;强强联合&#xff0c;基于芯驰D9…

迅速理解什么是通信前置机

通信前置机设在两个通信对象之间&#xff0c;是实质性的物理服务器&#xff0c;适应不同通信协议或数据格式之间的相互转换。 前置机的作用&#xff1a; 隔离——隔离客户端与服务端&#xff0c;保障后端安全减负——处理非核心业务&#xff0c;分担后端服务器压力&#xff0…

yolov8实时推理目标识别、区域分割、姿态识别 Qt GUI

介绍一个GUI工具&#xff0c;可以实时做yolov8模型推理&#xff0c;包括目标检测、姿态识别、跟踪、区域分割等操作。 可以接入图像、视频或者RTSP视频流进行验证。 推理模型用的是yolov8转onnx之后的。用ultralytics自带的转换即可&#xff0c;不用带NMS。 框架用的是Qt 任…

javaspringboot--AOP

AOP AOP:Aspect Oriented Programming (面向切面编程、面向方面编程)&#xff0c;其实就是面向特定方法编程 依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-aop</artifactId></dependency…

vue2+Echarts数据可视化 【帕累托图】

接口得到的数据如下 要经过排序 &#xff0c;计算累计百分比得到数据 蓝色 柱状图数据&#xff1a; 取count字段值 横坐标&#xff1a;取 id值 折线图&#xff1a;根据柱状图的数据计算累计百分比 getInterface(data) {getParetoChart(data).then((res) > {if (res) {thi…

qiankun中主系统启动子系统本地静态图片加载404或者跨域问题

由于本地启动主系统和子系统&#xff0c;如果主系统内不放子系统的图片就会导致主系统访问不到子系统的图片 对于这个问题有三种解决方案&#xff0c;这里一一说明 1、第一种也是我常用的&#xff0c;就是把子系统中的静态图片全部转为base64这样通过主系统访问的时候就不是通…

EMC辐射发射RE整改方法?|深圳比创达电子EMC

一、排除外界因素 1、将被测设备关电&#xff0c;确认背景噪声是否满足标准要求(标准要求―电波暗室的背景噪声在限值线以下6dB)&#xff1b; 2、确认测试布置是否满足标准要求。 二、宽带噪声抑制方法 1、谱线问题描述&#xff1a;30&#xff5e;300MHz频段内出现宽带噪声…

C++类-派生类

类之间的关系 类之间的三种关系&#xff1a; 包含关系&#xff1a;class B{ private: A a;}使用关系&#xff1a;class B{public: void method(A &a);}继承关系&#xff1a;class B: public A{} 继承 继承允许我们依据另一个类来定义一个类&#xff0c;这使得创建和维护…

C语言实现简易版扫雷游戏

由于前面所讲知识点有限&#xff0c;无法实现扫雷游戏的全部功能&#xff0c;本期为各位呈现的是相对简单且易于编写的扫雷游戏。 第一步 设计游戏可玩多次的循环框架 这里在之前猜数字游戏时使用的循环框架一致&#xff0c;但是上次讲解不够深入&#xff0c;这里补充一下。这…

Java8新特性:强大的Stream API

5.1 说明 Java8中有两大最为重要的改变。第一个是 Lambda 表达式&#xff1b;另外一个则是 Stream API。Stream API ( java.util.stream) 把真正的函数式编程风格引入到Java中。这是目前为止对Java类库最好的补充&#xff0c;因为Stream API可以极大提供Java程序员的生产力&am…

为养宠家庭量身打造,352 X63 Pet宠物专效空气净化器“养宠安馨,人宠共护”

当下,养宠人群日益增多,宠物在给家庭带来了欢乐的同时,也产生了一系列困扰,如何在健康环境中快乐养宠,成为很多家养宠家庭的新需求。成立于2014年的北京三五二环保科技有限公司是一家立足于家庭洁净空气和安全用水领域的科技创新型公司。以“安全、健康、舒适”等消费需求为核心…

AUTOSAR_RS_LogAndTrace中文翻译(待更)

4功能概述 5.功能要求 5.2.1.1通用型 1.日志记录应支持初始化和注册 2. 日志功能应该使应用程序提供日志信息 3. 日志功能应能和追踪应用程序之间通信&#xff0c; 4. 日志应支持对日志信息进行分组&#xff0c;使用案例&#xff1a;关联过滤所有属于一起的日志信息 5. 日志记…

mos管工作原理

MOS管的工作原理可以通过增强型和耗尽型两种类型来解释。增强型MOS管在栅极电压达到一定值时会逐渐形成沟道&#xff0c;而耗尽型MOS管内部本身就存在沟道&#xff0c;随栅极电压的升高而减小。在增强型MOS管中&#xff0c;栅极的正电荷会吸引P型半导体中的电子&#xff0c;排斥…