微信小程序 - （下拉）加载更多数据

<view class='table-rank'>
<view class='tables center' wx:for="{{ranklist}}" wx:for-index="idx" wx:key="prototype">
<view class='stage-rank'>
{{idx+1}}
</view>
<view class='name'>{{item.name}}</view>
<view class='price'>{{item.count}}</view>
</view>
</view> <view class='more'>
<button loading="{{loading}}" disabled="{{disabled}}" catchtap="setLoading">{{loadText}}</button>
</view>

var app = getApp().globalData;Page({
data: {
loadText: '加载更多',
ranklist: [],
count: 1
}, onLoad: function(res) {
// 首次加载：传参数num:0
let num = 0;
let _page = this;
let uid = wx.getStorageSync('uinfo').uid; wx.request({
url: 'url',
data: {
uid,
num
},
header: {
'content-type': 'application/json'
},
method: 'GET',
dataType: 'json',
responseType: 'text',
success(res) {
_page.setData({
ranklist: res.data.all_list,
me: res.data.me
});
}
})
}, //点击 加载更多 按钮
setLoading(e) { let _this = this;
let _page = this; // 暂存数据
let ranklistBefore = _this.data.ranklist; let uid = wx.getStorageSync('uinfo').uid; // 每次加载数据条数(10)
let num = _this.data.count++ * 10; wx.request({
url: app.api.simulation_ranking,
data: {
uid,
num
},
header: {
'content-type': 'application/json'
},
method: 'GET',
dataType: 'json',
responseType: 'text',
success(res) {
// 每次加载数据,请求一次就发送10条数据过来
let eachData = res.data.all_list; if (eachData.length == 0) {
wx.showToast({
title: '没有更多数据了!~',
icon: 'none'
})
} else {
wx.showToast({
title: '数据加载中...',
icon: 'none'
})
} _page.setData({
loadText: "数据请求中",
loading: true,
ranklist: ranklistBefore.concat(eachData),
loadText: "加载更多",
loading: false,
});
}
})
}
});