可以使用 v-cloak 指令設置樣式，這些樣式會在 Vue 實例編譯結束時，從綁定的 HTML 元素上被移除。

當網絡較慢，網頁還在加載 Vue.js ，而導致 Vue 來不及渲染，這時頁面就會顯示出 Vue 源代碼。我們可以使用 v-cloak 指令來解決這一問題。

html：

{{context}}

js：

效果：

我們使用 v-cloak 指令來解決屏幕閃動的問題吧O(∩_∩)O~

js 不變，在 div 中加入 v-cloak 指令。

html：

{{context}}

css：

[v-cloak]{ display: none;}

使用 v-cloak 指令之后的效果(demo)：

---

在簡單項目中，使用 v-cloak 指令是解決屏幕閃動的好方法。但在大型、工程化的項目中(webpack、vue-router)只有一個空的 div 元素，元素中的內容是通過路由掛載來實現的，這時我們就不需要用到 v-cloak 指令咯。

作者：deniro
鏈接：https://www.jianshu.com/p/f56cde007210
來源：簡書
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。

總結

以上是生活随笔為你收集整理的js div加载html_说说 Vue.js 中的 v-cloak 指令的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。