小程序上拉加载更多php,微信小程序上拉加载更多

微信小程序上拉加载更多

注意问题：

1.当网速比较慢时候，可能会发生重复请求数据，所以需加一个开关的控制

2.窗口必须设置高度，否则无法触发事件

page.wxmlscroll-view scroll-y style="height: {{windowHeight}}px;" bindscrolltolower="loadMore"    view class='list'      view class='item' wx:for="{{list}}"        {{item.title}}      /view     /view  /scroll-view

page.js// pages/news/news.jsPage({  /**   * 页面的初始数据   */  data: {    list:[],//数据列表    windowHeight:'400',//窗口高度    page:1,//页码    flag:true  //开关 true表示可以请求数据  },  /**   * 生命周期函数--监听页面加载   */  onLoad: function (options) {    this.requestData();    //获取屏幕高度    var that=this;    wx.getSystemInfo({      success: function (res) {        that.setData({          windowHeight: res.windowHeight        })            }    })  },  requestData(){          this.setData({        flag:false      })      var that=this;      var api = 'http://www.phonegap100.com/appapi.php';      wx.request({        url: api,         data: {          a: 'getPortalList',          catid: '20',          page: that.data.page        },        header: {          'content-type': 'application/json' // 默认值        },        success: function (res) {          if (res.data.result.length20){//请求到的数据length20时候，表示已经是最后一页，关掉开关            var f=false;          }else{            var f=true;          }          var list = that.data.list.concat(res.data.result)          var page = ++that.data.page;          that.setData({            list: list,            page: page,            flag: f          })        }      })  },  loadMore(){//出发加载更多    if (this.data.flag){      this.requestData();    }  }})