vue中v-if、v-show使用区别

• v-if和v-show都可以控制元素区块在页面中的显示，这两个分别在什么场景下使用呢，我们来一起看下

v-if通常会搭配v-else-if、v-else使用

• 在页面中，按条件渲染，条件区块只有当条件首次变为 true 时才被渲染。如初始值是false时，则区块不会被渲染
• 在切换时，条件区块内的事件监听器和子组件都会被销毁与重建。

v-show通常会在初始时就会被渲染，只是因为条件不符合为隐藏状态。

可理解为，当v-show条件为false时，该区块最外层节点的样式属性display为false， 当条件为true时，对应区块CSS display 属性会被切换为true显示出来

总的来说，v-if 有更高的切换开销，而 v-show 有更高的初始渲染开销。

因此，如果需要频繁切换，则使用 v-show 较好；

如果在运行时绑定条件很少改变，则 v-if 会更合适。