前言:虽然网上有很多资料说了v-if和v-show的区别,但是总是会忘记,不如自己做一次笔记,忘记的时候就可以直接来看看,希望对大家也能有所帮助。
一.用法上的区别
1.v-show不支持template
2.v-show不可以和v-else一起使用
二、本质上的区别
1.v-show元素无论是否需要显示到浏览器上,它的DOM实际都是有渲染的,只是通过CSS的display属性来进行切换。
2.v-if当条件为false时,其对应的原素压根不会在DOM中渲染。
三、适用场景
那什么时候该用v-if,什么时候该用v-show呢?适用场景各自如下:
1.如果我们的元素需要频繁的在显示与隐藏中切换,就应该使用v-show,这样就不会反复重绘DOM节点而只是更改css的display属性。
2.如果元素不会频繁切换,那么就应该使用v-if,减少在渲染DOM时渲染的节点。
希望看完本篇文章能够对大家有所帮助!