1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > 解决vue中双击事件会触发两次单击事件问题

解决vue中双击事件会触发两次单击事件问题

时间:2020-04-14 14:00:55

相关推荐

解决vue中双击事件会触发两次单击事件问题

问题描述:当在dom上同时绑定单击事件和双击事件时,点击双击事件会触发两次单击事件,这是我们不想看到的,而是应该单击事件与双击事件分开。

分析:单击事件和双击事件区别就在间隔时间,当我们点击一次时,设置一个延时器,延时一定时间(300ms为好),在这300ms之内,在此点击,认定执行的是双击事件,如果超过300ms再点击第二次,执行的是单击事件。

方案:

单击事件代码:

handleNodeClick(data) {var that = this// 开启延时器,300ms的间隔区分单击和双击,解决双击时执行两次单击事件clearTimeout(that.time)that.time = setTimeout(() => {// 写单击事件执行的逻辑代码},300)}

双击事件代码:

// 双击事件dbclickNode(node, data) {clearTimeout(this.time)// 触发dbclick事件,传入sonmsg值this.$emit('dbclick', data)},

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。