原理的区别

1.v-show

① v-show是简单地基于css进行切换，操作于display：none/block属性，不论初始值是什么，dom元素一直存在。
② v-show由false变为true的时候不会触发组件的生命周期。
③ v-show有较高的初始渲染消耗

2.v-if

① v-if是真正的条件渲染，它确保会在切换过程中条件块内的是事件监听器和子组件被销毁和重建，只有渲染条件为真时才会渲染
② v-if由false变为true时，会触发组件的beforeCreate、create、beforeMount、mounted生命周期钩子，由true变为false时触发组件的beforeDestory、destroyed方法。
③ v-if有较高的切换消耗

使用的区别

1.v-show

① 具有非常频繁地切换用v-show较好

2.v-if

① 如果运行时的条件变化频率较小，则使用v-if较好 ② v-if有配套的v-else-if和v-else共同使用 ③ v-if可以搭配template使用