Vue中v-cloak的作用
阿新 • • 發佈：2018-12-10
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> /*屬性選擇器*/ [v-cloak]{ display:none; } </style> </head> <body> <div id="app" > <!--解決插值閃爍--> <p v-cloak>{{ message }}</p> </div> <!--一般情況下面，要把這個放在頁面下面載入防止頁面載入慢，但是上面的{{message可能顯示出來不好看，所有在上面的p標籤加入v-cloak表示頁面載入完成再顯示}}--> <script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script> <script> new Vue({ el: '#app', data: { message: 'Hello Vue.js!' } }) </script> </body> </html>
如果需要檢視緩慢載入的閃爍效果，可以調低chrome的網速
