我试图让VueJS与Laravel合作,并且发生了一些奇怪的事情。
我的模板:
<div id="tuto">
<p>{{ texte }}</p>
</div>
我的VueJS脚本:
var vm = new Vue({
el: '#tuto',
data: {
texte: '<span>Mon texte</span>',
}
});
我收到此错误:
使用未定义的常量texte - 假设&#39; texte&#39; (查看:/var/www/vhosts/choraleuniversitaire.fr/laravel.choraleuniversitaire.fr/chorale/resources/views/admin/choriste/index.blade.php)
有人知道它搞砸了吗?
感谢&#39; S
答案 0 :(得分:5)
如果您使用的是.blade.php
文件,则需要执行以下操作:
<div id="tuto">
<p>@{{ texte }}</p>
</div>
这是因为刀片还使用了胡须,所以在vue看到它们之前它们会被刀片处理,这就是为什么你从Laravel
而不是Vue
收到错误的原因。
有关详细信息,请参阅Laravel文档的Blade & JavaScript Frameworks section。
答案 1 :(得分:1)
有两种方法可以解决这个问题。
1:在胡须前使用@
。
示例:
@{{ texte }}
2:另一个是在代码块上使用@verbatim
指令。
示例:
@verbatim
{{ texte }}
@endverbatim
https://laravel.com/docs/5.4/blade#blade-and-javascript-frameworks
答案 2 :(得分:-1)
data
must be一个功能:
var vm = new Vue({
el: '#tuto',
data: function(){
return {
texte: '<span>Mon texte</span>'
}
}
});