通过点击次数或者时间戳实现都行:
判断条件:在300秒内有两次连续单击事件触发就是双击,否则就是单击
export default {
data () {
return {
clickCount: 0,
time: 0
}
},
methods: {
dblclick () {
//使用点击次数实现,如果双击了就重置计数器进入下一次双击判断
// this.clickCount++
// if (this.clickCount === 2) {
// console.log('双击事件')
// this.clickCount = 0
// }
// 不清空会有不连续两次点击都能触发双击的bug,只要300毫秒内没有连续两次单击,就重置计数器=0方便判断下一次
// setTimeout(() => {
// if (this.clickCount === 1) {
// console.log('单机事件')
// this.clickCount = 0
// }
// }, 300)
// 使用时间戳实现,300秒内,记录上一次单击进来的时间,然后用下次单击的时间-上次单击的时间<300毫秒的话就是双击
this.time = new Date().getTime()
setTimeout(() => {
if (new Date().getTime() - this.time < 300) {
console.log('双击事件')
}
}, 300)
}
}
}