vue.js

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript类库 > vue.js > 使用v-if隐藏元素时出现闪烁问题

vue中使用v-if隐藏元素时会出现闪烁问题的解决

作者:不靠谱的作曲家

这篇文章主要介绍了vue中使用v-if隐藏元素时会出现闪烁问题的解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

使用v-if隐藏元素时出现闪烁问题

解决办法在div中加入v-cloak

<div class="mask" v-if="modelShow" v-cloak></div>

然后在css中

[v-cloak] {
  display: none;
}

就OK啦~

v-if控制显隐,页面加载出现闪现 v-cloak

<div id="divApp">  
<div v-if="type === 'A'" v-cloak>    
A  
</div>  
<div v-else-if="type === 'B'" v-cloak>    
B  
</div>  
<div v-else-if="type === 'C'" v-cloak>    
C  
</div>  
<div v-else v-cloak>    
Not A/B/C  
</div>
</div>
[v-cloak] 
{ 
display:none;
}

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

您可能感兴趣的文章:
阅读全文