小程序下拉刷新,上拉分页

小程序下拉刷新,上拉分页代码样例:

data:{
    loading: true,
	//用于数组的追加和暂存
	allList:[],
	//用于渲染页面的数组
	tempList: [],
	//每页显示的行数:
	pagelimit: 10,
	//页码(从1开始):
	pagenum: 1,
	//用于标识是否还有更多的状态
	state: 1,
}
onShow: function () {
	// TODO 加载数据
	this.data.pagenum=1
	this.loadOrder();
},

 // 加载订单
loadOrder:function(){

	var params = {
		pageNum: this.data.pagenum,
		pageLimit: this.data.pagelimit
	}
	// 异步请求
	orderModel.orderList(params).then(res => {
		this.setData({loading: false});
		
		//结果数据
		var resList = res.list
		var restLength=res.list.length
		
		if (restLength < 1) {
			this.setData({ tempList: [], state: 0 });
		}else {
			var tempState = 1;
			//如果有数据,但小于每次期望加载的数据量(pagelimit),将state设为0,表示后面已没有数据可加载
			if (restLength < this.data.pagelimit){
				var tempState = 0;
			}
			//循环将结果集追加到数组后面
			if(this.data.pagenum==1){
				this.data.allList = []
			}
			for (var i = 0; i < restLength; i++) {
				this.data.allList.push(resList[i]);
			}

			this.setData({
				tempList: this.data.allList,
				state: tempState
			});
		}
	}, () => {
		this.setData({loading: false});
	});

	// setTimeout(()=>{
	//     this.setData({loading:false});
	// }, 1000)
},


 /**
 * 页面相关事件处理函数--监听用户下拉动作
 */
onPullDownRefresh: function () {
	wx.showNavigationBarLoading() //在标题栏中显示加载

	// TODO加载数据
	this.data.pagenum=1
	this.loadOrder()

	wx.hideNavigationBarLoading() //完成停止加载
	wx.stopPullDownRefresh() //停止下拉刷新
},

/**
 * 页面上拉触底事件的处理函数
 */
onReachBottom: function () {
	// console.log('上拉触底。。');
	if(this.data.state>0) {
		this.data.pagenum = this.data.pagenum + 1
		this.loadOrder()
	}
},
···
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值