場景:
使用瀏覽器自帶的功能模擬在特定條件下出現插值表達式閃爍的問題。較小的模塊我們可以忽略此問題，如果模塊較大就會大大影響我們的體驗。
原因:
對於dom的操作還是由JavaScript去操作，在vue中，我們會等待dom元素加載完畢然後我們纔會去渲染模板。
解決:
v-cloak
官方文檔解釋：這個指令保持在元素上直到關聯實例結束編譯。和 CSS 規則如 [v-cloak] { display: none } 一起用時，這個指令可以隱藏未編譯的 Mustache 標籤直到實例準備完畢。
也就是說使用此命令配合css屬性可以讓元素在編譯未完成之前一直都處於隱藏的狀態。
<html>
<head>
<style>
[v-cloak]{
display: none;
}
</style>
</head>
<body>
<div id="app">
<!-- 使用 v-cloak能夠解決插值表達式閃爍的問題 -->
<p v-cloak> ====={{ msg }}-------</p>
</div>
</body>
<script src="../js/vue.js"></script>
<script>
var app = new Vue({
el:"#app",
data:{
msg:"hello vue",
}
})
</script>
</html>
親測有效!