vue中的vcloak使用

35次阅读

共计 256 个字符,预计需要花费 1 分钟才能阅读完成。

1、用法
这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如 [v-cloak] {display: none} 一起用时,这个指令可以隐藏未编译的 Mustache 标签直到实例准备完毕

2、作用
在 html 中绑定 vue 实例,为了防止在页面加载时先出现变量名闪烁的情况,造成不好的用户体验

<div id="app">
    {{msg}}
</div>

通过 css 配置样式并在加载元素上使用 v -cloak 就可以解决闪烁的问题

[v-cloak] {display: none}
<div id="app" v-cloak>
    {{msg}}
</div>

正文完
 0