v-if 与 v-show的区别

前言：虽然网上有很多资料说了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时渲染的节点。

希望看完本篇文章能够对大家有所帮助！