Laravel未定义的变量异常与vue.js


Laravel undefined variable exception with vue.js

我想在 laravel 刀片系统中测试一个简单的 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>

问题是在渲染视图文件时,laravel 想要将消息作为变量或常量访问并且由于没有任何消息变量传递给视图,我得到了使用未定义的常量异常。那么解决方案是什么?

add @{{message}}

这会告诉刀锋忽略这一点。

前端和后端组合相同的表示法不是一个好方法。当然,有了@,刀锋可以忽略。

一个更干净的想法是从后端提取前端,因为 Blade 和 Vue.js使用相同的符号:

  • 前端与html,css en javascript(在你的例子中是Vue.js)
  • 后端(在 php 中,在您的情况下为 Laravel)作为 REST-api,带有返回 json 的 php

最大的优势:

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