为什么Vue.js在Laravel 5.6中不显示任何内容?

时间:2018-11-16 11:23:38

标签: laravel vue.js

我已经按照Laravel 5.6中的这些步骤安装了vue.js,所有其他依赖项都运行良好。仅Vue.js没有响应。

npm intall 
npm run dev
npm run watch

我正在分享我添加的所有代码。我在HTML文件中创建了一个id =“ app”。

<div id="app">
            <div class="container">
              <articles></articles>                  
            </div>

<!-- I used this link in my html file for connecting with app.js file 
  -->
 <script src="{{asset('js/app.js')}}"></script>

我编辑了如下的app.js文件。

require('./bootstrap');

    window.Vue = require('vue');


    Vue.component('articles', require('./components/Articles.vue')
    );

    const app = new Vue({
        el: '#app'
    });

我还创建了Articles.vue文件并将其链接到app.js。但是我的html页面什么也没显示。 我在components / Articles.Vue中的文件

<template>

<h1>Hello World!</h1>

</template>

控制台未显示任何错误 enter image description here

Vue标签 enter image description here

当我检查DOM时,我得到了 enter image description here

这是Vue文件。它也没有显示任何标签 enter image description here

1 个答案:

答案 0 :(得分:0)

正如ceejayoz在评论中所说:将其重命名为articleElement并将其用作<article-element></article-element>