wxml
<scroll-view
scroll-y
style="width: 100%; height: 100vh;"
refresher-enabled="{{true}}"
refresher-threshold="{{100}}"
refresher-triggered="{{triggered}}"
bindrefresherpulling="onPulling"
bindrefresherrefresh="onRefresh"
bindrefresherrestore="onRestore"
bindrefresherabort="onAbort">
<view wx:for="{{arr}}" style="display: flex; height: 100px; background-color: #eee;">
</view>
</scroll-view>
js
Page({
data: {
arr: [],
triggered: false,
},
onReady: function () {
const arr = []
for (let i = 0; i < 2; i++) arr.push(i)
this.setData({
arr
})
setTimeout(() => {
this.setData({
triggered: true,
})
}, 1000)
},
onPulling(e) {
console.log(this.data.triggered);
},
onRefresh() {
if (this._freshing) return
this._freshing = true
setTimeout(() => {
this.setData({
triggered: false,
})
this._freshing = false
}, 300)
},
onRestore(e) {
console.log(this.data.triggered);
},
onAbort(e) {
console.log(this.data.triggered);
},
})
官方scroll-view的例子,只是把列表的数据减少到不足一屏的数据就会产生这个问题
如上gif 动画
参考scroll-view 自定义下拉刷新无法复位
https://developers.weixin.qq.com/community/develop/doc/000e2098d4894033580a0e4555b000