解決vue與node模版引擎的渲染標(biāo)記{{}}(雙花括號)沖突問題
由于之前練習(xí)koa2,直接渲染的jquery寫的傳統(tǒng)頁面。
這次想偷懶,直接script引入vue,發(fā)現(xiàn)渲染不出data值。
渲染引擎用得是xtpl, 找了半天沒有發(fā)現(xiàn)可以修改xtpl渲染分隔符的配置
vue有!
var myVue = new Vue({ el: ’#msgBoard’, delimiters:[’$$’,’$$’], data() { return { msg: { num: 10 } } }, mounted() { console.dir(this) }, })
補充知識:前端——vue和nunjucks的模板渲染符{{}}沖突解決辦法
由于在thinkjs上使用的是nunjucks的渲染技術(shù),在了解到vue的時候發(fā)現(xiàn)vue用的也是{{}}進行模板代碼識別。
找了一個vue的html代碼放到thinkjs上面跑,發(fā)現(xiàn)數(shù)據(jù)無法綁定。然后上網(wǎng)尋得解決辦法如下:
修改vue的標(biāo)識符,前后加{% raw %}、{% endraw %},如下:
{% raw %}{{result.name}}{% endraw %}
問題解決。
以上這篇解決vue與node模版引擎的渲染標(biāo)記{{}}(雙花括號)沖突問題就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. python利用os模塊編寫文件復(fù)制功能——copy()函數(shù)用法2. php測試程序運行速度和頁面執(zhí)行速度的代碼3. php網(wǎng)絡(luò)安全中命令執(zhí)行漏洞的產(chǎn)生及本質(zhì)探究4. 三個不常見的 HTML5 實用新特性簡介5. 無線標(biāo)記語言(WML)基礎(chǔ)之WMLScript 基礎(chǔ)第1/2頁6. ajax請求添加自定義header參數(shù)代碼7. Python使用jupyter notebook查看ipynb文件過程解析8. 解決Python 進程池Pool中一些坑9. 解決python腳本中error: unrecognized arguments: True錯誤10. IntelliJ IDEA創(chuàng)建普通的Java 項目及創(chuàng)建 Java 文件并運行的教程
