vue长按与点击事件

• Z时代
• 2024-01-10
• 分类：综合

var timeOutEvent=0;//定时器  
// html
<div @touchstart="gotouchstart" @touchmove="gotouchmove" @touchend="gotouchend"></div>
//js
gotouchstart(){
   let that = this;
   clearTimeout(timeOutEvent);//清除定时器
   timeOutEvent = 0;
   timeOutEvent = setTimeout(function(){
        //执行长按要执行的内容，
      ...
     },600);//这里设置定时
 },
      //手释放，如果在500毫秒内就释放，则取消长按事件，此时可以执行onclick应该执行的事件
gotouchend(){
    clearTimeout(timeOutEvent);
      if(timeOutEvent!=0){
        //这里写要执行的内容（尤如onclick事件）
     }
},
//如果手指有移动，则取消所有事件，此时说明用户只是要移动而不是长按 
gotouchmove(){
     clearTimeout(timeOutEvent);//清除定时器
     timeOutEvent = 0;
},

以上是 vue长按与点击事件 的全部内容， 来源链接： utcz.com/z/376690.html