【微信小程序】跟我不是很熟的触底刷新

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

再次总结一下

我还挺菜

你可能感兴趣的:(【微信小程序】跟我不是很熟的触底刷新)