小程序 - 左滑删除

html

<view 
  class="{{ moveActive && index === move_index ? 'addr-item-active':''}}"
  bindtouchstart="touchstart" bindtouchmove="touchmove" data-index="{{ index }}"
>
  <view class="btns default" catchtap="setDefault">设为默认</view>
  <view class="btns del" catchtap="delEv">删除</view>
</view>

js

Page({
  data: {
    moveActive: false,
    startX: 0,
    startY: 0
  },
  
  // 滑动开始 - 清除其他激活的滑动
  touchstart (e) {
    let move_index = e.currentTarget.dataset.index

    this.setData({
      move_index: move_index,
      moveActive: false,
      startX: e.changedTouches[0].clientX,
      startY: e.changedTouches[0].clientY
    })
  },

  // 滑动过程
  touchmove (e) {
    let startX = this.data.startX
    let startY = this.data.startY
    let touchMoveX = e.changedTouches[0].clientX
    let touchMoveY = e.changedTouches[0].clientY
    let angle = this.angleCalc(startX, startY, touchMoveX, touchMoveY)

    if (Math.abs(angle) > 30) return
    if (touchMoveX < startX) {
      this.setData({
        moveActive: true
      })
    }
    else {
      this.setData({
        moveActive: false
      })
    }
  },

  // 判断滑动角度
  angleCalc (startX, startY, touchMoveX, touchMoveY) {
    let x = touchMoveX - startX
    let y = touchMoveY - startY
    return 360 * Math.atan(y / x) / (2 * Math.PI)
  }
})