v-if和v-show区别和遇到的问题

不吃糖的哼哼

已于 2024-02-18 15:13:04 修改

阅读量45

点赞数 2

分类专栏： Vue 文章标签：前端

于 2023-11-14 13:56:46 首次发布

本文链接：https://blog.csdn.net/Y13349887034/article/details/134397435

版权

Vue 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

                    
                    v-if会让DOM从结构上消失，并且会触发生命周期（目前在写的一个cesium项目，使用v-if之后出现了地图变黑的问题，并且无法解决，使用v-show就不会出现这个问题）
v-show只是通过css的display:none的方式来把DOM隐藏起来
v-show和行内样式style="display: block;"一起使用的时候，会出现本该隐藏的DOM却显示在页面上的问题，这个就是样式冲突导致的，本来应该是none的却因为行内样式变成block显示了出来。解决这个奇怪的问题就是把v-show改成v-if，把这个DOM从结构上消除就可以解决这个奇怪的问题了
如果DOM的显隐会频繁切换，那么使用v-show更好一点，消耗的资源少一点