You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
72 lines
1.8 KiB
72 lines
1.8 KiB
6 years ago
|
let lastY = 0 // 上一次滚动的位置
|
||
|
|
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 (e) {
|
||
|
|
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
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
})
|