Laravel Vue组件可以'；扩展布局时找不到应用程序_Laravel_Vue.js

Laravel Vue组件可以'；扩展布局时找不到应用程序

laravel vue.js

Laravel Vue组件可以'；扩展布局时找不到应用程序,laravel,vue.js,Laravel,Vue.js,扩展包含id为“app”的div的布局时，不会加载vue元素，并给出错误“找不到元素：#app” 我试着做了一个新的布局，就是把@yield包装在一个id为app的div中，一个非常简单的组件，得到了相同的结果 ExampleComponent.vue <template> <div class="container"> {{ count }} </div> </template> <script> e

扩展包含id为“app”的div的布局时，不会加载vue元素，并给出错误“找不到元素：#app”

我试着做了一个新的布局，就是把@yield包装在一个id为app的div中，一个非常简单的组件，得到了相同的结果

ExampleComponent.vue

<template>
    <div class="container">
        {{ count }}
    </div>
</template>

<script>
export default{
    data() {
        return {
            count: 0
        }
    }
    }
</script>

欢迎使用.blade.php

@extends('layouts.new')

@section('content')
    <example-component></example-component>
@endsection

<head>
    <script src="{{ asset('js/app.js') }}"></script>
</head>
<body>
    Hello
    <div id="app">
        @yield('content')
    </div>
</body>

@extends（'layouts.new'）
@节（“内容”）
@端部

new.blade.php

@extends('layouts.new')

@section('content')
    <example-component></example-component>
@endsection

<head>
    <script src="{{ asset('js/app.js') }}"></script>
</head>
<body>
    Hello
    <div id="app">
        @yield('content')
    </div>
</body>


你好
@产量（‘含量’）

我希望数字0出现在页面上，但没有显示任何内容，并且控制台中出现错误：

“[Vue warn]：找不到元素：#应用”

检查页面时，示例组件被包装在一个id为app的div中。

为什么会出现此错误？

在加载

#app

div之前，您的

app.js

脚本将首先执行

将脚本放在

标记的末尾，而不是

中：


你好
@产量（‘含量’）

谢谢。让我困惑的是，我只是在做一个布局几乎相同的项目（脚本在标题中），而且工作正常。唯一真正的区别是，它也在使用Vuexi如果您将主脚本放在头上，那么您可能需要推迟实例化主Vue实例，直到加载DOM（即等待

DOMContentLoaded

事件）。