javascript - 使用vue2.0 + vue-resource时报错

问题描述

问 题

使用vue2.0 + vue-resource时报错，用vue1.0时，请求放在ready中并不会报错。
辛苦了。帮忙看一下，谢谢！

报错：

Uncaught TypeError: Cannot read property 'title' of undefined

代码：

<div id="app" class="app">
  <h1 class="title">{{datas.communityDetail.title}}</h1>
</div>
<script src="//cdn.bootcss.com/vue/2.1.5/vue.min.js"></script>
<!--<script src="//cdn.bootcss.com/vue/1.0.28/vue.min.js"></script>-->
<script src="//cdn.bootcss.com/vue-resource/1.0.3/vue-resource.min.js"></script>
<script>
  var app = new Vue({
    el: '#app',
    data: function(){
      return {
        datas: {}
      }
    },
    mounted: function () {
      this.getData();
    },
    methods: {
      //请求数据
      getData: function () {
        var self = this;
        this.$http.get('api.json', {
          params: {
            OPT: '305'
          }
        }).then(function(response) {
          self.datas = response.data;
        },function() {
          console.log('error')
        });
      }
    }
  })
</script>

解决方案

data: function(){
  return {
    datas: {
        communityDetail:{}
    }
  }
},

datas里又套了一层就不报错了。这个是什么原理？

这篇关于javascript - 使用vue2.0 + vue-resource时报错的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！