小程序开发（走过的路，踩过的抗）

小程序采用双向数据绑定，只需想办法更新你想更新的数据

1.onload 方法在页面初始化时调用

  方法调用顺序经验：先调研初始化函数，无参数初始化调用token检测，下面是两种不同情况onload方法的调用

/**
     * 创意大赛首页加载 --- 无初始化参数
     */
    onLoad: function(options) {
      const _this = this
      const token = wx.getStorageSync('token');
      console.log(token)
      if (!token) {
        _this.goLoginPageTimeOut()
        return
      }
      /**
       * token 检查**/
      WXAPI.checkToken(token).then(function (res) {
        if (res.code != 1000) {
          wx.removeStorageSync('token')
          _this.goLoginPageTimeOut()
        }
      })

    }


/**
     * 创意大赛文章详情页面- 先把参数进行初始化
     */
    onLoad: function (options) {
      var that = this;
      var str = options.detail;
      var detail = str.split("|");
      this.setData({
        aid1: detail[0],
        time: detail[2],
        topImg: detail[3],
      })
      const _this = this
      const token = wx.getStorageSync('token');
      if (!token) {
        _this.goLoginPageTimeOut()
        return
      }
      /**
       * token 检查**/
      WXAPI.checkToken(token).then(function (res) {
        console.log(res)
        if (res.code != 1000) {
          wx.removeStorageSync('token')
          _this.goLoginPageTimeOut()
        }
      })

    }

2.onshow 方法再每次回显页面时候调用，从授权页面跳转至首页；从授权页面调用wx.navigateBack();授权成功返回首页即调用onshow方法；这个方法用来渲染数据。调用代码如下

/**
     * 此方法内的函数没有必要每次都调用；判断调用结果是否存在，存在则不调用即可
     */
    onShow: function() {
        console.log('调研 on show');
      var that = this;
      that.judgeSQ();
      that.imgFun();
    }

 //判断授权
  judgeSQ: function () {
    var that = this;
    that.setData({
      sessionId: wx.getStorageSync('token')
    })
    //如果页面中存在查询结果则不进行调用，防止多次调用
    if (that.data.ranks.length==0){
       that.dataList();
    }
    that.prizeList();  
  }

3.上拉下拉刷新留白问题（上拉下拉都进行授权判断）

/**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function() {
      //下拉后自动回退，上面不会留白
      wx.stopPullDownRefresh();
      const _this = this
      const token = wx.getStorageSync('token');
      console.log(token)
      if (!token) {
        _this.goLoginPageTimeOut()
        return
      }
      /**
       * token 检查**/
      WXAPI.checkToken(token).then(function (res) {
        if (res.code != 1000) {
          wx.removeStorageSync('token')
          _this.goLoginPageTimeOut()
        }
      })
      var that = this ;
        wx.showLoading({
            title: '加载中',
        })
        this.setData({
                page1 : 1,
                ourselfs: [],
                ranks: [],
                noMoreHidden: true,
        })
        setTimeout(function() {
            that.onShow();
            wx.hideLoading();
        }, 2000);

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function() {
      const _this = this
      const token = wx.getStorageSync('token');
      if (!token) {
        _this.goLoginPageTimeOut()
        return
      }
      /**
       * token 检查**/
      WXAPI.checkToken(token).then(function (res) {
        console.log(res)
        if (res.code != 1000) {
          wx.removeStorageSync('token')
          _this.goLoginPageTimeOut()
        }
      })
        wx.showLoading({
          title: '加载中',
        })
        setTimeout(function () {
          _this.dataList1()
          wx.hideLoading();
        }, 2000);
        /**
        var isLoading = this.data.isLoading;
        var rankslen = this.data.ranks.length;
        var page1 = this.data.page1;
        var that=this;
        if (isLoading == true && rankslen >= 10) {
            page1 = page1 + 1;
            that.setData({
                page1: page1
            })
            
        }
         */
    }

4.把新查询的数据push进之前结果集中

var ranks1 = that.data.ranks;
 for (var i = 0; i < res.data.ranks.length; i++) {
      ranks1.push(res.data.ranks[i]);
 }

5.对于列表数据点赞，样式变化问题，本人采用了些技巧。代码如下：

        //点赞成功后    
        if (res.code == 4000) {
              //用来接收点赞的索引 -1 默认没有对应上索引，不能为0 因为索引开始值为0
              var index = -1;
              for (var i = 0; i < ourselfs.length; i++) {
                if (ourselfs[i].art.aid == aid) {
                  //查到此文章对应索引
                  index = i;
                }
              }
              if (index != -1) {
                //索引找到开始进行更新
                that.setData({
                  [`ourselfs[${index}].art.isthumbs`]: true,
                  [`ourselfs[${index}].art.thumbs`]: num + 1
                })
              }
              wx.showToast({
                title: "点赞成功",
                icon: 'none',
                duration: 2000
              })
            } else {
              wx.showToast({
                title: res.msg,
                icon: 'none',
                duration: 2000
              })
            }

git地址：https://github.com/tb544731152/blog-idea