分享一个小程序订单分页

使用的是onReachBottom

var util=require('../../../../utils/util')
Page({

    /**
     * 页面的初始数据
     */
    data: {
        page: 1,
        pageSize: 10,
        servicesList: {
            list: []
        }
    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad(options) {
        this.getList()
    },
    getList() {
        let that = this
        let header = {
            token: abcd
        }
        let p = {
            page: that.data.page,
            pageSize: that.data.pageSize
        }
        util.request('aaaaa', 'POST', header, p,
            function (resp) {
                console.log(resp)
                let oldList = that.data.servicesList.list
                let list = resp.list
                let nowList = [...oldList, ...list]
                that.setData({
                    servicesList: resp,
                    "servicesList.list": nowList
                })
            })
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow() {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide() {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload() {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh() {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom() {
        if (this.data.servicesList.totalPage > this.data.page) { //判断当前也是否小于总页数
            this.setData({
                page: this.data.page + 1 //当前页加一
            });
            this.getList()
        } else {
            wx.showToast({
                title: '到底啦!',
                icon:'success'
              })
            return false;
        }
    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage() {

    }
})

wxml页面直接for循环

<view class="orders" wx:for="{{servicesList.list}}" wx:key="index">
    <view class="orders_con">
        <view class="con_top">
            <view>{{item.name}}</view>
            <view style="font-size: 28rpx;">{{item.statusName}}</view>
        </view>
      
    </view>
</view>
<view style="margin: 140rpx 0;background-color: #f9f9f9;text-align: center;" wx:if="{{servicesList.list==''}}">
    <image src="/images/icon/null.png" mode="" style="width: 300rpx;height: 300rpx; margin:0 auto;" />
    <view style="color: #999;">暂无订单</view>
</view>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值