如何避免{{expr}} flash在Vue.js接管之前在頁面上顯示？

Question

例如，我在一個頁面中具有稍微大的量的跨度（超過300+）的，每個跨距具有{{expr}}結合以顯示其內容：

<span>{{expr}}</span> 

右加載頁面之後，字面{{expr}}將閃爍，顯示在VueJS接管並顯示真實綁定值之前的頁面上。這對客戶來說看起來很糟糕，有沒有辦法避免它？

Answer 1

v-cloak是您正在查找的HTML屬性。

該指令將保留在元素上，直到關聯的Vue實例完成編譯。結合CSS規則（如[v-cloak] { display: none }），該指令可用於隱藏未編譯的鬍鬚綁定，直到Vue實例準備就緒。