解决Vue初始化的时候,页面闪烁现象

使用vue开发时,在vue初始化之前,由于div是不归vue管的,所以我们写的代码在还没有解析的情况下会容易出现花屏现象,看到类似于{{message}}的字样,虽然一般情况下这个时间很短暂,但是我们还是有必要让解决这个问题的,从网上搜了下,有博主给出的解决方案是,在css里加上:

[v-cloak] {
    display: none;
}

我试了一下,还是没有彻底的解决问题,页面加载之前,仍然会有短暂的花屏现象,摸索好久,终于找出一个解决方案,就是在我的根dom上加上  style="display: none;" :style="{display: 'block'}"

<div class="app" style="display: none;" :style="{display: 'block'}">
	{{message}}
</div>

ok,完美解决vue初始加载前的花屏现象

 

 

 

--------------------------------------------------------------

程序员交流qq群:782974737,点击加入

已标记关键词 清除标记
©️2020 CSDN 皮肤主题: 创作都市 设计师:CSDN官方博客 返回首页