微信小程序（2）--下拉刷新和上拉加载更多

下拉刷新

1.首先在.json文件中配置（如果在app.json文件中配置，那么整个程序都可以下拉刷新。如果写在具体页面的.json文件中，那么就是对应的页面下拉刷新。）

具体页面的.json文件：

{
  "enablePullDownRefresh":true
}  

app.json文件：

  "window":{
    "enablePullDownRefresh": true
｝

2.js文件中添加回调函数

 /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

上拉加载更多(不需要配置)

  /**
   * 页面上拉触底事件的处理函数
   */
onReachBottom: function () {
  
 },

1.publish.wxml文件

<block wx:for="{{publishs}}" wx:key="publishs">
<view class="publish">
  <text>{{item.songname}}</text>
</view>
</block>
<view class="weui-loadmore" hidden="{{!isHideLoadMore}}">
    <view class="weui-loading"></view>
    <view class="weui-loadmore__tips">正在加载</view>
</view>
<view class="Completesollow"  hidden="{{!searchLoadingComplete}}">没有更多了...</view>

2.publish.js文件

/**
   * 页面的初始数据
   */
  data: {
    publishs:[],
    isHideLoadMore:false,  //"上拉加载"的变量，默认false，隐藏  
    searchLoadingComplete:false,  //“没有数据”的变量，默认false，隐藏 
    page:1, //第一页
    isFromSearch:true
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.dataget()
  },
  dataget:function(){
    var that = this
    wx.request({
      url: 'https://c.y.qq.com/soso/fcgi-bin/search_for_qq_cp?g_tk=5381&uin=0&format=json&inCharset=utf-8&outCharset=utf-8&notice=0&platform=h5&needNewCode=1&w=%E9%9F%B3%E4%B9%90&zhidaqu=1&catZhida=1&t=0&flag=1&ie=utf-8&sem=1&aggr=0&perpage=20&n=15&p='+this.data.page+'&remoteplace=txt.mqq.all&_=1501467319794', //仅为示例，并非真实的接口地址
      data: {
        x: '',
        y: ''
      },
      header: {
        'content-type': 'application/json'
      },
      success: function (res) {
        console.log(res.data)
          //判断是否有数据，有则取数据 
        if (res.data.data.song.curnum!= 0) {
          let searchList = [];
          //如果isFromSearch是true从data中取出数据，否则先从原来的数据继续添加  数据继续添加进数组 that.data.publishs.concat
          that.data.isFromSearch ? searchList = res.data.data.song.list : searchList = that.data.publishs.concat(res.data.data.song.list)
        that.setData({
          publishs: searchList,
          isHideLoadMore: true,
        })
        }else{
          that.setData({
            searchLoadingComplete: true, //显示  
            isHideLoadMore: false  //把"上拉加载"的变量设为false，隐藏  
          });
        }
      }
    })
  },
  //加载更多
  onReachBottom: function () {
    console.log('加载更多')
    setTimeout(() => {
      this.setData({
        // isHideLoadMore: true,
        // searchLoadingComplete: false,
        page:this.data.page+1,
        isFromSearch: false 
      })
      this.dataget();
    }, 1000)
  },