问题描述:当在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)
},