vue中的长按事件和点击事件冲突

ps：我是个新手，最近一直在做移动端的项目，先说下需求，点击图片预览，长按删除，之前在图片上帮定了点击事件和长按事件，但是会有冲突，由于智商不够，百度半天才解决的，最后直接把点击事件给去了，直接用定时器械的，记录下，下次直接用就好了

1，触屏事件

touchstart: //手指放到屏幕上时触发

touchmove: //手指在屏幕上滑动式触发

touchend: //手指离开屏幕时触发

touchcancel: //系统取消touch事件的时候触发，这个好像比较少用

由于这次不需要计算移动的距离，所以一只用touchstart和touchend这两个事件

<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;

      },