页面加载时如何隐藏VueJS语法?

本文介绍了页面加载时如何隐藏VueJS语法?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

也许这是一个琐碎的问题.

maybe this is a trivial question.

因此，当我在浏览器上运行vuejs应用程序并启用限制下载速度时(设置为低连接).我在浏览器中未完成的vue语法输出.

so, when I run my vuejs application on browser with enables throttling download speed (sets to low connection). I got unfinished vue syntax output in browser.

我知道我们可以通过在整个页面加载之前显示正在加载图像来解决这个问题，但是有什么最好的解决方案来解决此问题?

I know we can trick this out with showing loading image before entire page has loaded, but it's there any best solution to fix this?

推荐答案

您可以使用 v -cloak 指令，如果将其与正确的CSS结合使用，它将隐藏Vue实例，直到编译完成.

You can use the v-cloak directive, which will hide the Vue instance until the compilation finishes, if you combine it with the right CSS.

HTML:

<div v-cloak>{{ message }}</div>

CSS:

[v-cloak] { display: none; }