vue.js - laravel使用vue-resource,报错Uncaught SyntaxError: Unexpected token -PHP中文网问答

文章专题 AI工具学习下载问答源码最近更新

PHP

会员中心讲师中心微信公众号

vue.js - laravel使用vue-resource,报错Uncaught SyntaxError: Unexpected token

世界只因有你 2017-05-16 16:48:59

[PHP讨论组]

1787

按照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)
    });
  }
});

我想问的是，具体是什么原因导致的，以后的语法规则应该遵循哪一种？

补充：

世界只因有你

全部回复(2)

黄舟2017-05-16 16:50:59 2楼

單純語法錯誤，你仔細看下第一個報錯的代碼

  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()
  }