移动端实现长按删除

最近在做一个订单列表，实现的功能是长按删除，值得注意的点是：该订单还有点按进入详情功能，因此，我一开始还以为会冲突，查了之后，发现click和touch事件是可以共存的，使用settimeout就可以完美解决。
主要参考的文章：https://blog.csdn.net/yuyuking/article/details/79241257

这里结合业务情况简单说一下：
touch事件列表：

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

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

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

touchcancel:     //系统取消touch事件的时候触发

业务中的代码：

<div class="order-list" @click="goOrderDetail( order.order_id)" @touchstart.native="showDelete(order.order_id )" @touchend.native="clearLoop()">

//使用了vuex，在action中的写法
export function showDelete({ dispatch, state },orderid){
  clearInterval(this.Loop);
  this.Loop = setTimeout(function() {
    this.showConfirm=true
    this.deleteOrderId=orderid;
  }.bind(this), 1000)
}
......
export function clearLoop(e) {
    clearInterval(this.Loop);
}

妈妈再也不用担心touch和click互相覆盖啦。这里还试验了一下，如果不设置touched的延迟事件，touch事件是要比click事件先执行的。