vue实现购物车滑动删除

先来看看效果图

 

写两个盒子，都用定位，内容的盒子right 0  ，删除盒子right 负盒子的宽度

内容盒子注册滑动事件

@touchstart="touchS" @touchmove="touchM" @touchend="touchE"

 

下面贴上滑动方法

// touch事件，显示删除
      touchS (e) {
        if (this.mode !== 'cart') return
        this.clientX1 = e.changedTouches[0].clientX
        this.clientY1 = e.changedTouches[0].clientY
      },
      touchM (e) {
        if (this.mode !== 'cart') return
        this.clientX2 = e.changedTouches[0].cli