vue-resource为什么在独立组件里面使用没有反应？

Question

npm下载的vue-resource，在project的入口文件中引用了。

import  VueResource from 'vue-resource'
Vue.use(VueResource)

然后现在有一个单独的组件 BookMes，
组件里面的js代码

<script>
  export default{
    name: 'BookMes',
    data(){
      return {
        BookMes: {
          img: require('../assets/book.png'),
          name: '天才在左，疯子在右',
          author: 'CCCCC',
          text: '这个世界，究竟是什么样的呢？这是一个看似很简单的问题．不过必须注意的是：看似。多年前我曾经收到过一张生日卡，上面写的那句话很动人：最精彩的，其实就是世界本身。也就是看到这句话不久，我希望在有生之年能够环游世界，因为总觉得有必要认识下自己生活的这个星球。也就是有了这个愿望后不久，我想到了刚刚提到的问题：这个世界究竟是怎样的。在好奇心驱使下，我通过各种各样的渠道和方式，花了很多时间和精力去寻找答案。但是我发现，谁也说不清这个世界到底是怎样的。就在我为此困惑的时候，某次听一个是精神科医生的朋友说起了一起病例。然后好像明白了一些：明白为什么没人能说清这个世界到底是怎样的了。'
        },
        gridData:[],
        apiUrl: 'http://211.149.193.19:8080/api/customers',
      }
    },
    ready: function () {
      this.getCustomers();
    },
    methods: {
      getCustomers: function () {
        Vue.$http.get(this.apiUrl).then(
            function (response) {
                console.log(response.body);
            },function (response) {
            console.log('22222');
          }
        )
      },
    }
  }
</script>

但是好像没有任何反应，控制台也没有任何输出，这个apiurl是有效的，能直接获取到数据。

Answer 1

Vue.$http 改成 this.$http, 这里 Vue 是没有定义的