亚洲一区二区三区无码少年_日韩亚洲欧美综合一区二区三区_国产精品成人69xxx_被主人狠狠调教打屁股_国产女厕所偷窥系列在线视频_老头猛挺进王进霞的体内视频_日本女同伦理片_一级毛片特黄视频免费观看_国产成人无码免费看视频软件

微信小程序?qū)崿F(xiàn)下拉刷新實現(xiàn)數(shù)據(jù)的追加

作者：龍 時間：2018-08-09 瀏覽：

1.思路

在微信小程序中提供了下拉刷新的api（onPullDownRefresh()）,那么實現(xiàn)下拉刷新的業(yè)務(wù)就是再下拉的時候，在原有的數(shù)據(jù)中追加新的數(shù)據(jù)

2.代碼實現(xiàn)

2.1 坑一

onPullDownRefresh: function () {
    var _this =this;

    /**顯示loading */
    wx.showNavigationBarLoading();

    _this.newsrequest(_this.data.page);

    wx.stopPullDownRefresh();
    wx.hideNavigationBarLoading();   
    // console.log(_this.data.newslists)
  },
  
  
  /**請求數(shù)據(jù) */
  newsrequest:function(page){
    var _this=this;
    // console.log(_this.data.page)
    requstFfunc.requestData('https://xxxx.cn/Public/Api/index.php', { service: 'Default.Archives', typeid: '44', orderby: '4', page:page, pagesize: '10' }).then(function (data) {
      var result = _this.newsdatadecorate(data.data.data.list);
      console.log(page)
      console.log(result)
     
      var arr=_this.data.newslists;
      if (result.length>0){
        /*此時會發(fā)現(xiàn)數(shù)據(jù)被添加到原有數(shù)據(jù)的后邊類似上拉加載更多*/
        _this.setData({
          newslists: _this.data.newslists.concat(result)
        });
        _this.data.page++;
      }
    })
  },

我們知道數(shù)組的concat方法時講參數(shù)數(shù)組拼接到原有數(shù)據(jù)后邊，所以與我們想要的追加在前面不想符合，想想該數(shù)組前面追加的方法時unshift()更改代碼：

2.2坑二

有人說concat方法時在數(shù)據(jù)后邊追加，那么只要再使用數(shù)組反轉(zhuǎn)reverse()將數(shù)組反轉(zhuǎn)，仔細(xì)想想，這種數(shù)據(jù)不是我們想要的下拉刷新的

    var arr1 = [1,2,3,4];//原來的數(shù)據(jù)
    var arr2 = [5,6,7,8];//后來的數(shù)據(jù)
    var arr3 = arr1.concat(arr2);//[1,2,3,4,5,6,7,8];
    var arr4 = arr3.reverse();//[8,7,6,5,4,3,2,1]
    //但是我們想要的應(yīng)該是
    var arr5 =[5,6,7,8,1,2,3,4]

newsrequest:function(page){
    var _this=this;
    // console.log(_this.data.page)
    requstFfunc.requestData('https://xxxx.cn/Public/Api/index.php', { service: 'Default.Archives', typeid: '44', orderby: '4', page:page, pagesize: '10' }).then(function (data) {
      var result = _this.newsdatadecorate(data.data.data.list);
      console.log(page)
      console.log(result)
     
      var arr=_this.data.newslists;
      if (result.length>0){
        _this.setData({
          newslists: _this.data.newslists.concat(result).reverse()
        })
        _this.data.page++;
      }
    })
  },

2.2坑三

newsrequest:function(page){
    var _this=this;
    // console.log(_this.data.page)
    requstFfunc.requestData('https://xxxx.cn/Public/Api/index.php', { service: 'Default.Archives', typeid: '44', orderby: '4', page:page, pagesize: '10' }).then(function (data) {
      var result = _this.newsdatadecorate(data.data.data.list);
      console.log(page)
      console.log(result)
     
      var arr=_this.data.newslists;
      if (result.length>0){
        for(var t in result){
          _this.data.newslists.unshift(result[t])
        }
        _this.data.page++;
      }
    })
  },

但是頁面的數(shù)據(jù)不顯示，具體原因不詳，應(yīng)該是this.data.方法設(shè)置數(shù)據(jù)，應(yīng)該和頁面的生命周期有關(guān)，在數(shù)據(jù)設(shè)置時，頁面已渲染,（自己想想的，不知道對不對） 

這是我們就可以通過中介，將數(shù)據(jù)拼接好了之后，再通過this.setData()方法設(shè)置數(shù)據(jù)，這時就可以正常顯示

newsrequest:function(page){
    var _this=this;
    // console.log(_this.data.page)
    requstFfunc.requestData('https://xxxx.cn/Public/Api/index.php', { service: 'Default.Archives', typeid: '44', orderby: '4', page:page, pagesize: '10' }).then(function (data) {
      var result = _this.newsdatadecorate(data.data.data.list);
      
      var arr=_this.data.newslists;
      if (result.length>0){
       
        for(var v in result){
          arr.unshift(result[v])
        };
        _this.setData({
          newslists:arr
        });
        
        _this.data.page++;
      }
    })
  },

上述方案雖然成功了實現(xiàn)了數(shù)據(jù)追加，但是。。。且看下邊代碼

    var arr1 = [1,2,3,4];//原來的數(shù)據(jù)
    var arr2 = [5,6,7,8];//后來的數(shù)據(jù)
    var arr3 = arr2.concat(arr1);//[5,6,7,8,1,2,3,4];
    
    //但是我們想要的應(yīng)該是
    var arr5 =[5,6,7,8,1,2,3,4]
    //此時兩個數(shù)據(jù)是不是一致的呢
    

newsrequest:function(page){
    var _this=this;
    // console.log(_this.data.page)
    requstFfunc.requestData('https://xxxx.cn/Public/Api/index.php', { service: 'Default.Archives', typeid: '44', orderby: '4', page:page, pagesize: '10' }).then(function (data) {
      var result = _this.newsdatadecorate(data.data.data.list);
      console.log(page)
      console.log(result)
     
      var arr=_this.data.newslists;
      if (result.length>0){
        _this.setData({
          newslists: result.concat(_this.data.newslists)
        });
        _this.data.page++;
      }
    })
  },