小程序学习——上拉加载and下拉刷新（适用于130400以下版本

上拉加载

借助小程序组件scroll-view

<scroll-view scroll-y="true"  bindscrolltolower="onscrolllower" class='moviegirdcontainer'>
    <block wx:for="{{movies}}" wx:for-item="movie" wx-key="">
      <view class='sing-view-container'>
        <template is="movietemplate" data="{{...movie}}" />
      </view>
    </block>
</scroll-view>

bindscrolltolower滚动到底部/右边，会触发 scrolltolower 事件，具体说明请查看小程序文档https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html

注意：要想实现上拉加载功能，必须给scroll-view设置一个高度，不然不起作用

下拉刷新

与当前wxml同一文件夹下同一级别的json里设置

{
  "enablepullDownRefresh":true //注意：是true  而不是 "true"
    //设置这个就能调用小程序专有的onPullDownRefresh
}

相对应的js

 onscrolllower: function (event) {
    // nexturl 获取数据的地址 ，start 从哪个下标开始，count每次加载的数量
    var nexturl = this.data.url + "?start=" + this.data.totalnum + "&count=20";
    //processdoubanData  数据进行处理的方法
    util.http(nexturl, this.processdoubanData);

    // loading状态
    wx.showNavigationBarLoading()
},
 onPullDownRefresh: function () {
    var refreshUrl = this.data.url + "?start=0&count=20";
    this.data.movies={};
    this.data.isEmpty=true;
    util.http(refreshUrl, this.processdoubanData);
    // loading状态
    wx.showNavigationBarLoading()
  },
processdoubanData: function(data) {
  var movies = [];  
  var totalmovies = {};
  //如果要绑定新加载的数据，那么需要同旧有的数据合并在一起
  if(!this.data.isEmpty){
    totalmovies=this.data.movies.concat(movies)
  }else{
    totalmovies = movies;
    this.data.isEmpty = false
  }
  this.setData({
    movies: totalmovies
  });
  this.data.totalnum += 20;

//loading状态影藏
wx.hideNavigationBarLoading();

//结束下拉刷新
wx.stopPullDownRefresh();

},