v-cloakd的应用场景和使用方法

使用vue构建前端应用,加载应用后页面可能会出现闪烁:

<div id="app" v-cloak>
    {{message}}
</div>

例如上述场景,应用在加载时,可能会看到:

{{message}}

 等待一会儿后,数据才会渲染进来;针对该情况,可以在【el】挂载节点上添加“v-cloak”,并在引入的css样式中添加如下代码:

[v-cloak] {
    display : none;
}

 如果还出现界面闪烁的情况,那么考虑是【display】属性被上层级的属性覆盖了,可以做如下修改

[v-cloak] {
    display : none !important;
}

 这样处理问题就可以解决了

猜你喜欢

转载自www.cnblogs.com/luxiaohu/p/10126477.html