vue - 长摁操作

「真正的意志是不会被击败的」

2020-07-31

• 2535浏览

• 代码

• 104字

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