//uniapp端代码
<template>
<view>
<scroll-view style="height: 500px;" scroll-y="true" refresher-enabled="true" :refresher-triggered="triggered"
:refresher-threshold="100" refresher-background="lightgreen" @refresherpulling="onPulling"
@refresherrefresh="onRefresh" @refresherrestore="onRestore" @refresherabort="onAbort">
<view v-for="(item,index) in [1,2,3,4,5,6,7,8,9,10]" :key="item" style="background-color: #F0AD4E;margin-bottom: 20rpx;height: 150rpx;text-align: center;">
{{item}}
</view>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
triggered: false
}
},
onLoad() {
this._freshing = false;
setTimeout(() => {
this.triggered = true;
}, 1000)
},
methods: {
onPulling(e) {
// console.log("onpulling", e);
},
onRefresh() {
if (this._freshing) return;
console.log('onRefresh')
this._freshing = true;
setTimeout(() => {
this.triggered = false;
this._freshing = false;
}, 1000)
},
onRestore() {
this.triggered = 'restore'; // 需要重置
console.log("onRestore");
},
onAbort() {
console.log("onAbort");
}
}
}
</script>
<style>
</style>
//微信小程序代码
<scroll-view
scroll-y style="height: 500px;"
refresher-enabled="{{true}}"
refresher-threshold="{{100}}"
refresher-default-style="white"
refresher-background="lightgreen"
refresher-triggered="{{triggered}}"
bindrefresherrefresh="onRefresh"
bindrefresherrestore="onRestore"
bindrefresherabort="onAbort"
>
<view style="background-color: #F0AD4E;margin-bottom: 20rpx;height: 150rpx;text-align: center;" wx:for="{{[1,2,3,4,5,6,7,8,9,10]}}" wx:key="{{index}}">
{{item}}
</view>
</scroll-view>
Page({
data: {
triggered: false,
},
onLoad: function (options) {
this.setData({
_freshing: false
})
setTimeout(() => {
this.setData({
triggered: true
})
}, 1000)
},
onPulling(e) {
console.log('onPulling:', e)
},
onRefresh() {
if (this._freshing) return
this.setData({
_freshing: true
})
setTimeout(() => {
this.setData({
triggered: false,
_freshing: false
})
}, 1000)
},
onRestore(e) {
console.log('onRestore:', e)
},
onAbort(e) {
console.log('onAbort', e)
},
})
DCloud_UNI_LXH
有没有你操作的视频？或者详细的描述一下你的操作步骤，以及你想要的效果
2021-07-02 16:35
DCloud_UNI_LXH
你的意思是，在刷新状态的时候，再次下拉还会触发刷新？
2021-07-05 16:22
木叶96 (作者)
回复 DCloud_UNI_LXH: 已经上传视频了,麻烦看一下
2021-07-06 11:18
DCloud_UNI_LXH
回复 木叶96: 下拉的时候，如果你下来的高度超过了
refresher-threshold 默认 45px，则会触发刷新。此时不要松手，网上滑动，高度小于设定值即可触发abort2021-07-06 12:06
木叶96 (作者)
回复 DCloud_UNI_LXH: 实现下拉刷新，难道刷新结束后还需要手动去触发abort吗？我上传的视频中已经复现了，一次刷新结束后，没有触发abort又继续刷新了，之前版本是没有这个问题的，提供的示例代码也是可以复现这个问题的
2021-07-06 13:51
木叶96 (作者)
这问题只有在微信小程序的真机调试或者上传后的小程序小程序中会出现，APP真机调试和微信开发者工具是没有问题的
2021-07-06 13:54
DCloud_UNI_LXH
回复 木叶96: 你想说的是
restore吧？在小程序端使用的是他们自己的组件，可以去小程序的社区反馈此问题2021-07-06 14:43
木叶96 (作者)
回复 DCloud_UNI_LXH: 我刚刚重新上传了bug复现视频，视频中我只手动下拉一次触发刷新，但是实际效果是刷新结束后程序会自动继续触发刷新，陷入刷新循环。已经重新上传了代码示例，uniapp用的就是官方提供的代码，uniapp编译的小程序就会有这个bug，用微信原生小程序语法写是没有这个问题的。
2021-07-07 11:25
DCloud_UNI_LXH
回复 DCloud_UNI_LXH: 回复 4***@qq.com:
onRestore方法设置this.triggered = false，在onRefresh方法中设置this.triggered = true，可以解决在小程序端刷新的问题。2021-07-07 15:23