按照vue-resource官方文档,以及laravel官方文档都显示应该采用如下语法格式:
var demo = new Vue({
el: '#app',
data: {
gridColumns: {'#':'id', '公司名':'name', '组织名':'email', '电话':'created_at'},
gridData: []
},
methods: {
this.$http.get('../db').then((response) => {
this.gridData = response.data;
},(response) => {
console.log(response);
});
}
});
但是浏览器直接报错:(index):51 Uncaught SyntaxError: Unexpected token .
经过多方资料查找,以及调试,最终发现可以正常运行的语法如下:
var demo = new Vue({
el: '#app',
data() {
return{
gridColumns: {'#':'id', '公司名':'name', '组织名':'email', '电话':'created_at'},
gridData: []
}
},
mounted(){
this.$http.get('../db').then((response) => {
this.gridData = response.data;
},(response) => {
console.log(response)
});
}
});
我想问的是,具体是什么原因导致的,以后的语法规则应该遵循哪一种?
补充:
黄舟2017-05-16 16:50:59
单纯语法错误,你仔细看下第一个报错的代码
methods: {
// 這裡是對象呀,不能直接塞
this.$http.get('../db').then((response) => {
this.gridData = response.data;
},(response) => {
console.log(response);
});
}
应该是
methods: {
fetchData() {
this.$http.get('../db').then((response) => {
this.gridData = response.data;
},(response) => {
console.log(response);
});
}
},
mounted() {
this.fetchData()
}