vue移动端长按事件

  • 代码
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;
},
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容