Question

我有这样的代码：

app.js

require('./bootstrap');

window.Vue = require('vue');

Vue.component('qrcodes', require('./components/QrCodes.vue'));

const app = new Vue({
    el: '#app'
});
Vue.config.devtools = true;

QrCodes.vue

<script>
export default {
  data() {
      return {
        qrcodes:[],
        qrcode: {
            ....
        },
      }
  },

  created() {
      this.fetchQrCodes();
  },

  methods: {
      fetchQrCodes() {
          fetch('/api/qrcodes')    
            .then(res => res.json())
            .then(res => {
                console.log(res);
          })
      }
  },
}
</script>

我认为一切都应该没问题但是在浏览器开发者工具中我遇到了错误

app.js：47316获取http://localhost/qrcodes 404（未找到）   fetchQrCodes @ app.js：47316   创建@ app.js：47308

app.js：44443您正在开发模式下运行Vue。   确保在部署生产时打开生产模式。   在https://vuejs.org/guide/deployment.html查看更多提示   app.js：47317 Uncaught（in promise）SyntaxError：意外的标记＆lt;在位置0的JSON中       在app.js：47317       在

浏览器开发人员工具中的那些行看起来像

methods: {
    fetchQrCodes: function fetchQrCodes() {
        var _this = this;

        fetch('qrcodes').then(function (res) {   // this line didnt change after building
            return res.json();   // this line gives the second error
        }).then(function (res) {
            _this.qrcodes = res;
        });
    }
}

正如您所看到的，我的fetchQrCodes（）和浏览器不匹配，获取了我更改的错误网址。我正在运行npm run watch尝试将其关闭并运行npm run dev仍然无法更新浏览器代码。什么可能导致这种情况？

编辑：public / js / app.js构建正确且有正确的更改，但浏览器的app.js没有。

Laravel建立的Vue不会在网上发生变化

0 个答案: