19年的今天项目曾用过这个功能,但当时的代码是熊叔写的,虽然他跟我讲过怎么做,可我跟它不是很熟
上熊叔的后端代码
$limit = $request->has('limit') ? $request->input('limit') : 20;
$score_change_waters = $score_account->score_change_waters()->orderBy('created_at','desc')
->paginate($limit);
萌混过关也有萌不过去的一天,看着数据库要分页的数据,不得不面对它。
但我和熊叔的处理方式有那么一点点的不一样
if (!$request->startId) {
$recommendGoodsList = Goods::where('is_shelve', 1)->where('id', '>',0)->offset(0)->limit(10)->get();
} else {
$recommendGoodsList = Goods::where('is_shelve', 1)->where('id', '>', $request->startId)->offset(0)->limit(10)->get();
}
$gr = new GoodsResources();
$recommendGoodsListInfo = $gr->allToArray($recommendGoodsList);
unset($gr);//销毁对象
思路大概是 第一次访问api前端是不传startId过来的,不考虑那么多乱七八糟的了。从0开始查10个!
第二次开始,从前端返回的startI开始遍历10个出来!
接下来就要用到小程序的函数
//监听下拉动作
onReachBottom: function () {
wx.showToast({
title: '大波商品赶来中...',
icon: 'loading',
duration: 1000,
})
this.update(); // 要调用的查询方法
},
update:function(){
let that = this;
let goods = that.data.goods
let data = {
startId: goods[goods.length-1].id
}
util.request(api, 'GET', data).then(res => {
that.setData({
goods:that.data.goods.concat(res.data.data)
})
})
},
小知识点
合并数组有两个方法push 和concat
push 遇到数组参数时,把整个数组参数作为一个元素;而 concat 则是拆开数组参数,一个元素一个元素地加进去。
push 直接改变当前数组;concat 不改变当前数组。
触底加载的函数是onReachBottom(); 监听下拉的函数是onPullDownRefresh() 想要这个功能生效,别忘了在页面的json里面添加
"enablePullDownRefresh": true
再次总结一下
我还挺菜