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.
108 lines
2.8 KiB
108 lines
2.8 KiB
2 years ago
|
Component({
|
||
|
|
data: {
|
||
|
|
lastY: '',
|
||
|
|
translateHeight: 0,
|
||
|
|
state: -1,
|
||
|
|
scrollTop: 0,
|
||
|
|
enablePulldownFresh: false,
|
||
|
|
platform: ''
|
||
|
|
},
|
||
|
|
options: {
|
||
|
|
multipleSlots: true
|
||
|
|
},
|
||
|
|
properties: {
|
||
|
|
upperDistance: {
|
||
|
|
type: Number,
|
||
|
|
value: 80
|
||
|
|
}
|
||
|
|
},
|
||
|
|
ready() {
|
||
|
|
this.getSystemInfo()
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
/*解决ios下拉页面可以触发，安卓只有上划页面才可以触发 */
|
||
|
|
onPageScroll(e) {
|
||
|
|
console.log('eonPageScroll', e)
|
||
|
|
this.data.scrollTop = e.scrollTop
|
||
|
|
this.data.enablePulldownFresh = false
|
||
|
|
},
|
||
|
|
touchstart(e) {
|
||
|
|
console.log('下拉开始', e)
|
||
|
|
console.log('this.data.scrollTop', this.data.scrollTop)
|
||
|
|
this.data.lastY = e.touches[0].clientY
|
||
|
|
if (this.data.scrollTop === 0) {
|
||
|
|
this.data.enablePulldownFresh = true
|
||
|
|
} else {
|
||
|
|
this.data.enablePulldownFresh = false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
touchmove(e) {
|
||
|
|
console.log('下拉中', e)
|
||
|
|
let clientY = e.touches[0].clientY
|
||
|
|
let offset = clientY - this.data.lastY
|
||
|
|
if (this.data.scrollTop > 0 || offset < 0) {
|
||
|
|
return false
|
||
|
|
}
|
||
|
|
// this.data.translateHeight = offset
|
||
|
|
/*解决ios下拉页面遮挡问题 */
|
||
|
|
this.setData({
|
||
|
|
// translateHeight:this.data.lastY
|
||
|
|
translateHeight: 100
|
||
|
|
})
|
||
|
|
this.data.state = 1
|
||
|
|
if (this.data.enablePulldownFresh) {
|
||
|
|
if (this.data.translateHeight > this.data.upperDistance) {
|
||
|
|
this.data.state = 2
|
||
|
|
}
|
||
|
|
this.setData({
|
||
|
|
translateHeight: this.data.translateHeight > 100 ? 100 : this.data.translateHeight,
|
||
|
|
state: this.data.state
|
||
|
|
})
|
||
|
|
}
|
||
|
|
},
|
||
|
|
touchend(e) {
|
||
|
|
if (this.data.translateHeight > this.data.upperDistance) {
|
||
|
|
// 解决ios下来刷新数据不更新的问题
|
||
|
|
if (this.data.platform == 'android') {
|
||
|
|
if (this.data.enablePulldownFresh) {
|
||
|
|
this.setData({
|
||
|
|
translateHeight: 100,
|
||
|
|
state: 3
|
||
|
|
})
|
||
|
|
this.triggerEvent('pullDownRefresh')
|
||
|
|
return
|
||
|
|
}
|
||
|
|
this.stopRefresh()
|
||
|
|
} else {
|
||
|
|
if (!this.data.enablePulldownFresh) {
|
||
|
|
this.setData({
|
||
|
|
translateHeight: 100,
|
||
|
|
state: 3
|
||
|
|
})
|
||
|
|
this.triggerEvent('pullDownRefresh')
|
||
|
|
return
|
||
|
|
}
|
||
|
|
this.stopRefresh()
|
||
|
|
}
|
||
|
|
|
||
|
|
} else if (this.data.scrollTop <= 0) {
|
||
|
|
console.log('停止下来刷新')
|
||
|
|
this.stopRefresh()
|
||
|
|
}
|
||
|
|
},
|
||
|
|
stopRefresh() {
|
||
|
|
console.log('下拉刷新结束')
|
||
|
|
this.setData({
|
||
|
|
translateHeight: 0,
|
||
|
|
state: -1
|
||
|
|
})
|
||
|
|
},
|
||
|
|
getSystemInfo() {
|
||
|
|
const res = wx.getSystemInfoSync()
|
||
|
|
console.log('获取手机型号', res)
|
||
|
|
this.setData({
|
||
|
|
platform: res.platform//android,ios
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
})
|