微信小程序wx.request请求回来的数据没有及时显示到页面上

出问题的场景

//出问题的代码
Page({
  data: {
    swiper: {//顶部轮播
      indicatorDots:true,
      autoplay:true,
      interval:5000,
      duration:1000,
      imgUrls:[
          "http://preview.quanjing.com/top014/top-663618.jpg",
          "http://preview.quanjing.com/top019/top-747622.jpg"
      ]
    },
    matchsFirst:[//通栏上面的赛事     这部分数据是要显示在页面上的

    ],
    matchsSecond:[//通栏的赛事 这部分数据是要显示在页面上的

    ],
    matchsLast:[//通栏下面的赛事 这部分数据是要显示在页面上的

    ]
  }
  ....省略不相干代码
  );
  onLoad: function () {
          var that = this;
      wx.request({
        url:app.globalData.url.api.home,
        success: function(res) {
            var matchsFirst = xxx;
            var matchsSecond= xxx;
            var matchsLast= xxx;
            //这样直接赋值并不会把数据渲染到页面上的    不过 0.9版本的时候这样做是可以的   
            that.data.matchsFirst=matchsFirst;
            that.data.matchsSecond=matchsSecond;
            that.data.matchsLast=matchsLast;
        }});
    };

解决办法

//样这种方式赋值   坑了我一个上午   
that.setData({
          matchsFirst:matchsFirst,
          matchsSecond:matchsSecond,
          matchsLast:matchsLast
        });

微信官方原文

Page.prototype.setData()
setData 函数用于将数据从逻辑层发送到视图层，同时改变对应的 this.data 的值。

注意：

直接修改 this.data 无效，无法改变页面的状态，还会造成数据不一致。
单次设置的数据不能超过1024kB，请尽量避免一次设置过多的数据。