uni-app上拉加载下拉刷新的一个简单例子。
作者:互联网
<template>
<view>
<view v-for="item in list" :key="item.ppkid">
{{item.headline}}
</view>
<text class="loadMore" v-if="loading">{{!loading && list.length<1?"没有了":"加载中"}}</text>
</view>
</template><script>
export default {
data() {
return {
list:[],
loading:false,
refreshing:false,
pageNo:1,
}
},
onLoad() {
this.getData();
},
onReachBottom() {
/* 到底部加载 */
this.getData();
},
onPullDownRefresh() {
// 下拉刷新
this.refreshing = true;
this.getData();
},
methods: {
async getData(){
console.log("0000000000")
let para={
page:this.refreshing ==true? 1 : this.pageNo
};
this.loading=true;
const {
data
} = await this.$http.getunusedpaperlist(para);
if(data.code==1){
this.loading=false;
if (data.data.length ==0) {
uni.showToast({
title: '没有数据',
icon: 'none'
});
return false;
}
if (this.refreshing && this.list.length>0) {//上拉加载很多之后去刷新的页面
uni.showToast({
title: '已经最新',
icon: 'none'
});
this.refreshing = false;
uni.stopPullDownRefresh();
return;
}
if (this.refreshing) {//第一次加载
this.refreshing = false;
uni.stopPullDownRefresh();
this.list = data.data;
this.pageNo = 2;
} else {
this.list = this.list.concat(data.data);
this.pageNo += 1;
}
}
},
}
}
</script><style>
</style>
标签:false,refreshing,pageNo,app,list,上拉,uni,data 来源: https://blog.csdn.net/qq_33769914/article/details/118706965