时间戳

首页 > 解决方案 > 刀片内的新实例时 Laravel VueJS 错误

laravel - 刀片内的新实例时 Laravel VueJS 错误

问题描述

大家好，我尝试在 Laravel 上使用 VueJS 而不使用组件，但遇到错误。

[Vue warn]: Property or method "message" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property

在 laravel app.js 里面有默认的 VueJS 实例

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

所以这是我的 test.blade.php 的 html 代码

<div id="app">

    <div id="test" class="">
         @{{ message }}</h3>
    </div>

</div>

<script>

    new Vue({
        el: '#test',
        data: {
            message: 'Hello Vue!'
        }
    })

</script>

从代码来看，div #test 位于 div #app （默认 laravel vue 实例）内。

如果我注释掉默认的 laravel app vuejs 实例，问题就消失了。

我的问题是：

  1. 嵌套实例是被禁止的还是我做错了？如何在单个刀片页面上正确声明 Vue 实例？

  2. 从 Laravel 中注释掉默认的 Vue 实例是否安全？还是会影响 Laravel 中的其他 vue 组件？

谢谢

--

编辑：

发现了类似的问题，答案很好，所以我要关闭这个。

在 Laravel 5.3 中使用 Vue.js

编辑2：

如果您想利用 Blade 的强大功能但仍然享受 VueJS 的响应式，这是最好的解决方案

https://stackoverflow.com/a/54349029/417899

标签： laravelvue.js

解决方案

推荐阅读