码迷,mamicode.com
首页 > 其他好文 > 详细

VUE-v-cloak

时间:2018-08-26 18:26:10      阅读:164      评论:0      收藏:0      [点我收藏+]

标签:展示   因此   解决   body   表达   div   无法   属性   移除   

 
<style>
  [v-cloak]{
    display: none;
  }
</style>
 
<body>
  <div id="app">
  <h1 v-cloak>{{ msg }}</h1>
</div>
 
过程:
1 通过 CSS样式将 带有 v-cloak 属性的元素隐藏
2 这样,我们就无法看到 {{}} 了
3 等到vue解析完毕,会将页面中带有 v-cloak 的元素移除这个属性
4 那么,dispaly:none 的样式就失效,此时,就展示了元素
5 展示元素的时候, 插值表达式{{}} 已经被解析为对应的数据了
因此,就解决闪烁的问题了~

VUE-v-cloak

标签:展示   因此   解决   body   表达   div   无法   属性   移除   

原文地址:https://www.cnblogs.com/congtt/p/9537676.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!