|
uniapp 上拉加载&下拉刷新
上拉加载&下拉刷新 方法1
export default {
data() {
return {
listQuery: {
pageNo: 1,
pageSize: 10,
}, //分页
list: [], //列表
totalPage: 1 //当前页
};
},
onLoad() {
this._orderRecord()
},
methods: {
/*获列表
* @params this.listQuery 分页数据
*/
_orderRecord() {
let that = this;
if (this.listQuery.pageNo === 1) this.list = [];
this.$api.api.orderRecord(this.listQuery).then(res => {
setTimeout(function() {
uni.hideLoading(); uni.stopPullDownRefresh();
that.list = that.list.concat(res.list);
that.totalPage = res.totalPage
}, 500);
});
},
/* 上拉加载 */
onReachBottom() {
uni.showLoading({
title: '加载中'
});
if (this.totalPage = this.listAll) {
uni.stopPullDownRefresh()
return
}
this.listLoading = true//开始请求
this.$api.getMyDetailData({
biz_id: this.$store.state.user_biz_id,//参数根据业务需求
ptype: "get",
page: this.listPage,//重点是这个会变的请求页码
limit: 10
}).then(res => {
console.log("请求", res)
this.listLoading = false //请求完成
this.listData.push(...res.data) //追加数据
uni.stopPullDownRefresh() //停止刷新
})
},
// 首次加载&监听触底上拉和下拉
mounted() {
uni.startPullDownRefresh()
},
// 下拉触底函数
onReachBottom() {
//加载中就不进行加载
if (this.listLoading) {
return
} else {
//加载下一页
this.receivedLetter()//第一次的时候listPage=1
this.listPage++
}
},
// 监听下拉更新 （重新获取第一页信息）
onPullDownRefresh() {
//初始化信息
this.listPage = 1
this.listLoading = false
this.listData = []
this.listAll = 0
this.receivedLetter()
},
posted on
2022-10-08 11:34
一名小学生呀
阅读(169)
评论(0)
编辑
收藏
举报
|