var app = getApp()
Page({
data: {
page: 1,
goods: [],
last_page: "",
},
onLoad: function (options) {
let that = this;
wx.request({
url: 'http://www.workyy.com/index.php/admin/goodsList',
data: {
pageSize: 5, //每页查询条数
},
success: (res) => {
console.log(res);
that.setData({
goods: res.data.data.data,
last_page: res.data.data.last_page, //获取最后一页的页码数存起来
})
}
})
},
//瀑布流分页 上拉
onReachBottom: function (e) {
let _this = this;
let page = _this.data.page + 1; //获取下一页
wx.showLoading({ //温馨提示正在加载第几页
title: '正在加载第' + page + "页",
})
if (page > _this.data.last_page) { //判断是否到最后一页
wx.showToast({
//友情提示
title: '到底了',
icon: 'error'
})
}
//设置定时器 过滤加载时间
setTimeout(function () {
wx.request({
url: 'http://www.workyy.com/index.php/admin/goodsList',
data: {
page: page, //页码
pageSize: 5 //一次查询几条
},
success(res) {
_this.setData({
page: _this.data.page + 1, //页码加一
goods: _this.data.goods.concat(res.data.data.data) //两个数组合并
})
}
})
wx.hideLoading(); //清除正在加载的时间
}, 1000)
},
})
个人实现微信小程序瀑布流
于 2022-03-06 21:41:55 首次发布