iview DatePicker 日期选择组件在弹窗中使用transfer,导致选择日期弹窗会关闭的问题

背景:在弹窗里面使用日期选择组件,选择组件的面板被弹窗遮挡了部分,所以需要使用transfer属性,但是使用之后组件面板插入body中了,面板的事件会导致弹窗关闭。

解决方案: 

添加上transfer属性和指定的date-picker样式名

<DatePicker transfer transfer-class-name="date-picker" :value="dateValue" type="date"></DatePicker>

在合适的时机中,通过指定的样式名给日期选择组件的选择面板绑定事件进行阻止冒泡  

dateStopEvent() {this.$nextTick(() => {try {const ele = document.querySelector('.date-picker');ele.addEventListener('click', (event) => {event.stopPropagation();});} catch(e) {}});
}

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ONLYOFFICE 文档 8.0 现已发布:PDF 表单、RTL、单变量求解、图表向导、插件界面设计等更新

我们最新版本的在线编辑器现已推出&#xff0c;为整个套件优化了多项功能。阅读下文&#xff0c;了解详细更新内容。 什么是 ONLYOFFICE 文档 ONLYOFFICE 文档是一款开源的办公套件&#xff0c;由总部位于拉脱维亚的Ascensio System SIA开发。它支持处理文本文档、电子表格、演…

【数据结构 08】红黑树

一、概述 红黑树,是一种二叉搜索树,每一个节点上有一个存储位表示节点的颜色,可以是Red或Black。 通过对任何一条从根到叶子的路径上各个节点着色方式的限制,红黑树确保没有一条路径会比其他路径长上两倍,因而是接进平衡的。 红黑树性质: 根节点是黑色红节点的两个孩子…

热仿真中稳态与瞬态的区别

对于热仿真&#xff0c;根据是否随时间变化&#xff0c;可分为稳态&#xff08;steady&#xff09;仿真和瞬态&#xff08;transient&#xff09;仿真两类。 从数学计算的角度&#xff0c;所谓稳态是指物理量不随时间变化的定常过程&#xff0c;即计算域中所有物理量均满足关系…

【Cocos入门】Cocos中的定时器 (setTimeOut 、setInterval、Schedule )

目录 一、setTimeOut二、setInterval三、Schedule四、全局的schedule 一、setTimeOut 只执行一次 3秒后打印abc。 setTimeout(()>{console.log("abc"); }, 3000);删除计时器&#xff0c;3秒后不会输出abc。 let timeIndex; timeIndex setTimeout(()>{conso…

从前有条街 脚本 辅助 跳一跳

最近沉迷从前有条街。。。即将弃坑。 天工时间长的难以忍受。还好跳一跳能获得快乐水。找了一圈没有可用的脚本&#xff0c;于是自己写。。。 autojsx编写的 需要开启辅助功能跟悬浮窗 具体自行研究。 支持自动开始 无限续盘。目前只适配了1800*2400分辨率 。花了半个小时写的…

Roxlabs全球IP代理服务:解锁高效数据采集与网络应用新境界

引言 在这个数字化迅速发展的时代&#xff0c;数据采集和网络应用的重要性显得愈发突出。江苏阿克索网络科技有限公司旗下的Roxlabs&#xff0c;以其卓越的全球IP代理服务&#xff0c;正引领着这一领域的创新和发展。Roxlabs不仅提供遍及200多个国家和地区的高质量动态住宅IP资…

MOS栅极驱动和运放所需注意的关键参数

FD6288Q_&#xff08;JSMSEMI(杰盛微)&#xff09;FD6288Q中文资料_价格_PDF手册-立创电子商城 (szlcsc.com) MOS栅极驱动芯片&#xff1a; 自举电路&#xff1a; 电容的两个重要参数&#xff1a; ESR&#xff08;等效串联电阻&#xff09;和ESL&#xff08;等效串联电感&…

【SparkML系列3】特征提取器TF-IDF、Word2Vec和CountVectorizer

本节介绍了用于处理特征的算法&#xff0c;大致可以分为以下几组&#xff1a; 提取&#xff08;Extraction&#xff09;&#xff1a;从“原始”数据中提取特征。转换&#xff08;Transformation&#xff09;&#xff1a;缩放、转换或修改特征。选择&#xff08;Selection&…

C#使用RabbitMQ-4_路由模式(直连交换机)

简介 RabbitMQ中的路由模式是一种根据Routing Key有条件地将消息筛选后发送给消费者的模式。在路由模式中&#xff0c;生产者向交换机发送消息时&#xff0c;会指定一个Routing Key。交换机接收生产者的消息后&#xff0c;根据消息的Routing Key将其路由到与Routing Key完全匹…

Redis -- String 字符串, 计数命令,字符串操作

"学如逆水行舟&#xff0c;不进则退。" 目录 Redis的String字符串 常见命令 set get mget mset setnx setex psetex 计数命令 incr incrby decr decrby incrbyfloat 字符串操作 append getrange setrange strlen 小结 string内部编码 Redis…

【前端-VUE+TS】Vue3组件化-知识补充(六)

一. 动态组件 比如我们现在想要实现了一个功能&#xff1a; 点击一个tab-bar&#xff0c;切换不同的组件显示&#xff1b; 案例截图 这个案例我们可以通过两种不同的实现思路来实现&#xff1a; 方式一&#xff1a;通过v-if来判断&#xff0c;显示不同的组件&#xff1b;方式二…

三分钟教你入门规则引擎Drools

Drools是一款基于Java语言的开源的规则引擎&#xff0c;可以将复杂且多变的规则从硬编码中解放出来&#xff0c;以规则脚本的形式存放在文件或者特定的存储介质中(eg:数据库表)&#xff0c;使得业务规则的变更不需要修正项目代码&#xff0c;重启服务器就可以在线上环境立即生效…