v-if 和 v-show 的区别

两者区别

• v-if 是条件渲染，它会根据表达式的值的真假来决定是否渲染；
• v-show 是元素的显示和隐藏，它会根据表达式的值的真假来决定元素的 display 属性值；
• v-if 是“真正”的条件渲染，因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建；
• v-if 也是惰性的，如果在初始渲染时条件为假，则什么也不做——直到条件第一次变为真时，才会开始渲染条件块；
• 相比之下，v-show 就简单得多——不管初始条件是什么，元素总是会被渲染，并且只是简单地基于 CSS 进行切换。

使用场景

• v-if 适用于在运行时很少改变条件，不需要频繁切换条件的场景。
• v-show 适用于需要非常频繁切换条件的场景。