Laravel未定義的變量例外與vue.js

Question

我想測試中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想要訪問消息作爲變量或常量，因爲沒有任何消息變量傳遞給查看我得到使用undefined常量異常。那麼解決方案是什麼？

Answer 1

add @ {{message}}

這將告訴刀片忽略此。

Answer 2

這不是一個好的方法來結合前端和後端的相同表示法。當然，隨着@，刀片可以忽略。

更清潔的想法是提取後端的前端，因爲刀片和Vue.js使用相同的符號：

• 前端與HTML，CSS連接的JavaScript（在你的情況下， Vue.js）
• 後端（在PHP，Laravel你的情況）作爲REST的API與PHP返回JSON

大優點：

• 它更安全
• 它更易於維護
• 它的清潔