vue 防止頁(yè)面加載時(shí)看到花括號(hào)的解決操作
如下所示:
<style> [v-cloak]{ display:none }</style>
v-cloak v-text v-html
v-cloak用于大段
v-text用于單個(gè)標(biāo)簽
v-html用于帶有標(biāo)簽的處理
補(bǔ)充知識(shí):vue花括號(hào)數(shù)據(jù)綁定不成功的問(wèn)題
我就廢話(huà)不多說(shuō)了,大家還是直接看案例吧~
<!DOCTYPE html><html> <head> <meta charset='utf-8' /> <title></title> </head> <script src='http://www.b3g6.com/bcjs/js/vue.js' type='text/javascript' charset='utf-8'></script><!--引入vue--> <script src='http://www.b3g6.com/bcjs/js/main.js' type='text/javascript' charset='utf-8'></script><!--引入main--> <body> <div id='app'> <p>{{message}}</p> </div> </body></html>
main.js如下圖所示,只包含message信息,綁定到id為app的div上。
var app=new Vue({ el:’#app’, data:{ message:’hhh’ }})
結(jié)果顯示:
{{message}}
vue.js和自己寫(xiě)的js都在頭部引用,并不能出現(xiàn)理想中的message信息。
更改一下引入順序:
先引入vue.js——再寫(xiě)html內(nèi)容——最后引入自己寫(xiě)的js代碼。成功!原因暫時(shí)還不清楚,待日后填坑…
<!DOCTYPE html><html> <head> <meta charset='utf-8' /> <title></title> </head> <script src='http://www.b3g6.com/bcjs/js/vue.js' type='text/javascript' charset='utf-8'></script> <body> <div id='app'> <p>{{message}}</p> </div> </body> <script src='http://www.b3g6.com/bcjs/js/main.js' type='text/javascript' charset='utf-8'></script></html>
以上這篇vue 防止頁(yè)面加載時(shí)看到花括號(hào)的解決操作就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. idea導(dǎo)入maven項(xiàng)目的方法2. IntelliJ IDEA設(shè)置自動(dòng)提示功能快捷鍵的方法3. IntelliJ IDEA安裝插件的方法步驟4. Docker 部署 Prometheus的安裝詳細(xì)教程5. idea重置默認(rèn)配置的方法步驟6. 通過(guò)Django Admin+HttpRunner1.5.6實(shí)現(xiàn)簡(jiǎn)易接口測(cè)試平臺(tái)7. idea打開(kāi)多個(gè)窗口的操作方法8. idea設(shè)置代碼格式化的方法步驟9. idea給項(xiàng)目打war包的方法步驟10. IntelliJ IDEA設(shè)置背景圖片的方法步驟

網(wǎng)公網(wǎng)安備