小程序点击更多怎么进行数据拼接

业务场景:

      点击查看更多进行数据拼接显示 

 

 

实现思路:

     我们先在公共方法里边声明俩个属性,一个是页数page,一个是每次查询条数。

     页数默认的是第一页,我们在小程序的data里边设置一个page变量,默认也是1

     当发起请求的时候获取page,进行减1就可以获取到上一次查询最后的条数network_num就是这个值

 

    点击更多的时候将page+1,查询使用limit,第一个参数是从多少条开始,第二个参数是查询多少条

    最后一步就是点击更多进行数据的拼接,当我们初始化进入页面时,是从0开始的,会从数据库拿取第一批数据,当点击更多的时候,使用concat这个方法,将点击更多数据和原始数据进行拼接即可

 

注意:这里设置的network这个值必须跟你查询时的数量一样

 

 

PHP代码

class Common extends Controller {
    protected $page = 1; //默认第一页
    protected $network_num = 10;
    protected $network_bg = 0;
    protected function _initialize() {      
        $this->network_num = empty($network_num) ? 10 : $network_num;
        $this->network_bg = ($this->page - 1) * $this->network_num;
    }
}

 

使用你要查询的类继承common

class  Allinfo extends  Common{
    public function getInfo(){        
        $where['examine'] = 2;
        // $where['vip_time'] = ['>',time()];
        $product = Db::table('wxb_move_user')->where($where)->order('is_vip desc,creat_time desc')->limit($this->network_bg,10)->select();
        if(!$product){
            $send = ['code'=>400,'msg'=>'暂无数据'];
            return json($send);
        }
        $this->result($product, 200, '获取信息成功', 'json');
    }
}

小程序代码:

/*
author:咔咔
address:陕西西安
wechat:fangkangfk
*/

Page({

  /**
   * 页面的初始数据
   */
  data: {
    companyList:[],
    page:1,
    length:''
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.getCompanyInfo();
  },

  // 获取公司信息
  getCompanyInfo:function(){
    wx.showLoading({
      title: '加载中',
    })
    var that = this;
    var page = this.data.page;
    wxb.Post('/api/automatic.Allinfo/getInfo',{
      page: page
    },function(data){
      wx.hideLoading();
      console.log(data.length)
      that.setData({
        companyList: data,
        length:data.length
      })
    });
  },

  more:function(){
    var that = this;
    var companyList = this.data.companyList;
    var page = this.data.page;
    wxb.Post('/api/automatic.Allinfo/getInfo', {
      page: page+1
    }, function (data) {
      wx.hideLoading();
      console.log(data.length)
      that.setData({
        companyList: companyList.concat(data),
        length: data.length,
        page: page + 1
      })
    });
  },  
})

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

咔咔-

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值