v-show与v-if有什么区别？

相同点

v-show和v-if的作用效果相同，都能控制元素在页面中是否显示

<!--data数据-->
data() {
    return {
        flag:true
    }
}
<!--html-->
<p v-if='!flag'>v-if</p>
<p v-show='flag'>v-show</p>

当flag值为true时元素显示，当值为false则不显示在页面，上述例子仅显示文本v-show

虽然两者用法和功能都相同，但是控制手段和编译过程是不同的

v-show是将元素添加display:none属性，通过css来控制其显示与隐藏，只是简单的css切换
v-if是真正的条件渲染，暴力执法，直接将元素整个添加/删除
v-show初始渲染消耗高，v-if切换消耗高综上所诉，如果有需求需要进行频繁切换，则使用v-show性能较好，否则使用v-if