vue中的長按事件和點擊事件衝突

ps：最近一直在作移動端的項目，先說下需求，點擊圖片預覽，長按刪除，以前在圖片上幫定了點擊事件和長按事件，可是會有衝突，因爲智商不夠，百度半天才解決的，最後直接把點擊事件給去了，直接用定時器械的，記錄下，下次直接用就行了瀏覽器

1，觸屏事件

touchstart: //手指放到屏幕上時觸發
 touchmove: //手指在屏幕上滑動式觸發
 touchend: //手指離開屏幕時觸發
 touchcancel: //系統取消touch事件的時候觸發，這個好像比較少用

因爲此次不須要計算移動的距離，因此一隻用touchstart和touchend這兩個事件oop

<img  alt=""  v-for="(item,index) in imgurl" :src="item"  @touchstart.prevent="touchin(index)" @touchend.prevent="cleartime(imgurl[index])" >

.prevent是阻止瀏覽器的默認行爲，若是不須要的話，就不用添加了，根據本身的實際狀況

2，直接在methods裏寫長按方法和點擊事件

必定在data裏聲明Loop =0；否則無論用 500表示觸屏時間，能夠根據實際狀況寫，只要達到這個時間就會觸發setTimeout裏的事件 touchin(index){ var that=this; this.Loop = setTimeout(function() { that.Loop = 0; //執行長按要執行的內容，如彈出菜單
          MessageBox.confirm('是否確認刪除').then(action => { that.imgurl.splice(index,1) }) }, 500); return false; },

觸屏離開的事件 cleartime(index) { var that=this; clearTimeout(this.Loop); if(that.Loop!=0){ //這裏寫要執行的內容（尤如onclick事件）
 that.previewPicture(index) } return false; },