我正在使用Vue Templating和新的Laravel 5.4 . 在我 Office.vue 我有这个代码 .
<template>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">Example Component</div>
<div class="panel-body">
I'm an example component! {{ message}} | {{ type}} | {{ number }}
</div>
<span id="vue"></span>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
mounted() {
return this.displayOffices();
},
data: function(){
return {
message: "aw",
type: "test",
number: 2
}
},
methods: {
displayOffices: function(){
this.$http.get('/vueOffice', function(course) {
console.log(course);
});
}
}
}
</script>
显示数据是好的和良好的工作,但我得到错误
未捕获的TypeError:无法读取未定义的属性'get'
在 this.$http.get
我想要完成的是从该路由获取返回JSON数据的数据 .
我需要帮助修复此错误,一直在尝试搜索答案,但每个人都有不同的方式来实现Vuejs .
5 回答
如果您使用
axios
而不是vue-resource
,则将this.$http
替换为axios
.您必须先安装vue-resource才能使用
this.$http.get
或者您可以安装axios并使用
axios.get
而不是this.$http.get
不推荐使用它 . $ http.get因为Vue希望不再支持它 . 他们建议使用axios使用库 . 然后,您可以使用
this.axios.get()
.另一种方法是将以下代码添加到您的文件中:
Add this
require('vue-resource');
在您的文件中/resources/assets/js/bootstrap.js
后:
window.Vue = require('vue');