Php 带有vue.js的Laravel未定义变量异常

我想在laravel blade系统中测试一个简单的vue.js，下面是我在test.blade.php视图文件中的代码：

<div id="app">
   <p>{{message}}</p>
</div>
 <script src="{{url('/assets/js/vue/vue.min.js')}}"></script>
 <script>
  new Vue({
    el:'#app',
    data:{
        message:"hello world"
    }
});
</script>

{{message}}

新Vue({
el:“#应用程序”，
数据：{
信息：“你好，世界”
}
});

问题是，在呈现视图文件时，laravel希望将消息作为变量或常量访问，因为没有任何消息变量传递给视图，所以我使用了未定义的常量异常。那么解决方案是什么呢？

添加{{message}

这将告诉blade忽略此项。

add@{{message}

---

这将告诉blade忽略这一点。

前端和后端使用相同的符号不是一个好方法。当然，使用

@

，Blade可以忽略

更简洁的方法是从后端提取前端，因为Blade和Vue.js使用相同的符号：

• 前端使用html、css和javascript（在您的示例中是Vue.js）
• 后端（在php中，在您的例子中是Laravel）作为RESTAPI，带有返回json的php

最大的优势是：

• 它更安全
• 它更易于维护
• 它更干净

---

将相同的符号组合到前端和后端不是一个好方法。当然，使用

@

，Blade可以忽略

更简洁的方法是从后端提取前端，因为Blade和Vue.js使用相同的符号：

• 前端使用html、css和javascript（在您的示例中是Vue.js）
• 后端（在php中，在您的例子中是Laravel）作为RESTAPI，带有返回json的php

最大的优势是：

• 它更安全
• 它更易于维护
• 它更干净