小程序-下拉刷新与加载更多

json：

{
    "enablePullDownRefresh": true
}

wxml：

<view class='container'>
  <!-- 列表 -->
  <view class='oul'>
    <navigator class='oli' wx:for="{{list}}" wx:key="index" url='../detail/detail?id={{item.book_id}}' open-type="navigate" >
      <image src='{{item.img}}'/>
      <view class='oli_in'>
        <view class='oli_title'>{{item.title}}</view>
        <view class='oli_auther'>{{item.des}}</view>
      </view>
      <view class='clear'></view>
    </navigator>
  </view>
  <no_data id='no_data' title="暂无数据" wx:if="{{list && list.length==0}}" ></no_data>
</view>

wxss:

.clear{clear:both}
.oul{width:100%;height:auto;}
.oul .oli{padding:10px;border-bottom:1px solid #eee;}
.oul .oli .oli_title{font-size:16px;line-height:16px}
.oul .oli .oli_auther{display:-webkit-box;font-size:12px;color:#666;margin-top:5px;overflow:hidden;word-break: break-all;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp:2;}
.oul .oli image{width:17%;height:3rem;float:left;border-radius:5px;}
.oul .oli_in{width:80%;float:right}

js:

var req = require('../../utils/util')
Page({
  data: {
    list:[],
    prepage:0,//初始页码
    appdata:'',
    load_off:false //底部加载开关
  },
  onLoad: function (options) {
    var that = this;
    // console.log(that.data.show_picker_txt)//页面参数
  },
  onReady: function () {
    
  },
  onShow(){
    this.get_info(1);
  },
  get_info:function(is_refresh){
    var that = this;
    var ostar=0;
    //是否刷新
    if (is_refresh == 1) {
      that.setData({
        load_off:false,
        list: [],
        prepage:0
      });
    }else{
      ostar = that.data.prepage;
      ostar++;
      that.setData({
        prepage: ostar
      })
      ostar = ostar*10;
    }
    var obj={
      user_id:that.data.appdata.user_id
    }
    req.post('small_cook/detail/collection_list', obj,true)
        .then(res => {
          //重置变量
          var olist = res.data.data;
          var ini_list = that.data.list;
          for (var i = 0; i < olist.length; i++) {
            ini_list.push(olist[i]);
          }
          that.setData({
            list: ini_list
          });
          if(olist.length<10){
            that.setData({
              load_off: true
            });
          }
          wx.stopPullDownRefresh();
          wx.hideNavigationBarLoading(); //完成停止加载
          wx.hideLoading();
        })
  },
  //下拉刷新
  onPullDownRefresh() {
    var that = this;
    wx.showNavigationBarLoading() //在标题栏中显示加载
    that.get_info(1);
  },
  //底部加载
  onReachBottom: function () {
    if(this.data.load_off){
      return
    }
    // 显示加载图标
    wx.showLoading({
      title: '玩命加载中',
    })
    //请求
    var that = this;
    that.get_info(-1);
  }
})