scroll-view 官方API文档:https://uniapp.dcloud.io/component/scroll-view
<scroll-view scroll-y
:refresher-threshold="45"
:refresher-enabled="true"
:refresher-triggered="refresherTriggered"
@refresherrefresh="refresherrefresh"
@refresherrestore="refresherrestore"
@refresherabort="refresherabort"
<view>内容</view>
</scroll-view>
data() {
return {
refresherTriggered: false,
_refresherTriggered: false
}
},
methods: {
refresherrefresh(){
console.log("自定义下拉刷新被触发");
let _this = this;
if (_this._refresherTriggered) {
return;
}
_this._refresherTriggered = true;
//界面下拉触发,triggered可能不是true,要设为true
if (!_this.refresherTriggered) {
_this.refresherTriggered = true;
}
this.loadStoreData();
},
refresherrestore(){
console.log("自定义下拉刷新被复位");
let _this = this;
_this.refresherTriggered = false;
_this._refresherTriggered = false;
},
refresherabort(){
console.log("自定义下拉刷新被中止 ");
let _this = this;
_this.refresherTriggered = false;
_this._refresherTriggered = false;
},
loadStoreData() {
let _this = this;
this.listData();
setTimeout(() => {
_this.refresherTriggered = false;//触发onRestore,并关闭刷新图标
_this._refresherTriggered = false;
}, 1000)
},
listData() {
let _this = this;
//这里是调用后台接口的方法数据
},
}