下拉更新数据:
应用场景:刷新列表数据。
- 在app.json文件或页面对应的JSON文件中配置"enablePullDownRefresh": true;
//下拉更新数据
onPullDownRefresh(){
let _this = this;
_this.getShopOrderList(_this.page);
setTimeout(()=>{
wx.stopPullDownRefresh();
})
},
methods: {
getShopOrderList:function(page){
let _this = this;
_this.$API
.getShopDeliveryList({
page:page,
pageSize:_this.pageSize
})
.then(res => {
_this.orderList = res.billList;
})
.catch(res => {});
}
}
可以通过wx.startPullDownRefresh() 触发下拉刷新,效果与用户手动下拉刷新一致。
上拉加载更多:
应用场景:数据的分页加载。
- 在app.json文件或页面对应的JSON文件中设置"onReachBottomDistance":50触发距离;
//上拉加载下一页
onReachBottom(){
let _this = this;
//判断到是最后一页,则停止刷新
if((1+_this.page) > _this.totalPage){
_this.tip('没有更多了!');
return false;
}
_this.getShopOrderList(1+_this.page);
_this.page = 1+_this.page;
},
methods: {
getShopOrderList:function(page){
let _this = this;
_this.$API
.getShopDeliveryList({
page:page,
pageSize:_this.pageSize
})
.then(res => {
_this.orderList = _this.orderList.concat(res.billList);
_this.totalPage = Math.ceil(res.total/res.pageSize);
})
.catch(res => {});
}
}