epdc-resident-mp-js/subpages/association/components/pullingRefresh/pullingRefresh.js

let scale = 750 / wx.getSystemInfoSync().windowWidth // rpx转化比例
Component({
  options: {
    multipleSlots: true
  },
  data: {
    scrollTop: 0,
    translateHeight: 0, // 平移距离
    state: -1,
    lastY: 0,
    enablePullDown: true
  },
  properties: {
    // 触发下拉刷新的距离
    upperDistance: {
      type: Number,
      value: 150
    }
  },
  methods: {
    // 监听滚动，获取scrollTop
    onPageScroll (e) {
      this.data.scrollTop = e.scrollTop
    },
    touchStart (e) {
      this.data.lastY = e.touches[0].clientY
      if (this.data.scrollTop === 0) {
        this.data.enablePullDown = true
      } else {
        this.data.enablePullDown = false
      }
    },
    touchMove (e) {
      let clientY = e.touches[0].clientY
      let offset = clientY - this.data.lastY
      if (this.data.scrollTop > 0 || offset < 0) return
      this.data.translateHeight += offset
      this.data.state = 0
      this.data.lastY = e.touches[0].clientY
      if (this.data.enablePullDown) {
        if (this.data.translateHeight - this.data.scrollTop * scale > this.data.upperDistance) {
          this.data.state = 1
        }
        this.setData({
          translateHeight: this.data.translateHeight > 80 ? 80 : this.data.translateHeight,
          state: this.data.state
        })
      }
    },
    touchEnd () {
      if (this.data.translateHeight - this.data.scrollTop * scale > this.data.upperDistance) {
        if (this.data.enablePullDown) {
          this.setData({
            translateHeight: 80,
            state: 2
          })
          this.triggerEvent("scrolltoupper")
        }
      } else if (this.data.scrollTop <= 0) {
        this.stopRefresh()
      }
    },
    //  停止刷新
    stopRefresh () {
      this.setData({
        translateHeight: 0,
        state: -1
      })
    }
  }
})