它们的共同点是: 都可以控制元素是否可见,但是在使用的过程中有一些比较明显的区别,具体有以下3个。
- 原理不同。 v-show 是利用CSS中的 display 属性控制元素的显示和隐藏。v-if 是动态创建和销毁元素。
- 性能不同。 使用 v-if 频繁改变组件状态时，组件频繁的创建和销毁，因此 v-if 在状态更新时效率比较低。而在初次创建组件时,使用 v-if 效率高。 v-show 在状态更新时效率比较高，在初次创建时效率低。
- 使用场景不同。 v-show 一般适用于抽屉组件，折叠面板。 v-if 用于根据不同的状态显示不同的内容，例如： 用户初次登录时，根据性别动态决定用户的头像。
回答面试题时可以按照 总 — 分 — 结合实际 的方式回答。
