webpack中 引入了vue-resource， 但组件在使用get方法却提示undefined？

Question

webpack中 index.html中引入了/vue-resource.js 但组件在使用get方法却提示undefined;

点击查看完整代码

报措截图：

index.html引入了vue-resource.js (确认已经加载了此文件)

<script src="node_modules/vue-resource/dist/vue-resource.js"></script>

home.vue 组件中使用get()方法请求数据

<script>
    export default {        
        created:function(){     
            this.$http.get('/json/city-hot.json',{
            }).then(function(res){
                this.cityHot=res.data;
            },function(res){
                console.log(res.status);
            })          
        }        
    }
</script>

Answer 1

只是在script标签上引用了vue-resource但是Vue上并没有注册vue-resource，所以this.$http为undefined，在你的项目main.js下使用引入vue-resource模块并使用Vue.use(VueResource)引用：

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

具体参考Vue 1的文档using plugins

Answer 2

this指向有问题吧。