背景:使用uniapp vue开发小程序时,需要实现按钮双击事件

思路:通过给按钮绑定单击事件,然后定义一个数组记录每次单击的按钮标识和单击的时间戳,然后每次单击后比较数组最后两个元素,如果最后两个元素dom标识为同一个dom并且时间差值小于500ms,则判定为双击事件,执行双击事件逻辑

伪代码:

1. 给dom元素绑定单击事件:<view @click="fillAmount(index)">

2.定义数组用来保存每次单击的数据:clickArray: new Array()

数组元素结构{index: index, time: new Date().getTime()}其中index是dom元素标识

3.实现双击事件 

fillAmount(index){
    // index是dom元素标识
	this.clickArray.push({index: index, time: new Date().getTime()})
	if(this.clickArray.length >= 2){
		let item1 = this.clickArray[this.clickArray.length-1]
		let item2 = this.clickArray[this.clickArray.length-2]
		if(item1.index === item2.index &&
		(item1.time - item2.time) < 500){
			// 双击事件逻辑
		}
	}
}

以上就是自己的思路,如有问题恳请指正,不胜感激

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐