在面试的时候，一道vue基础到不能再基础的面试题叫做v-if与v-show的区别，当然答案网上一搜一大堆，基本两句话就能说明：
1.相同点：都是根据指令是否渲染该组件
2.不同点：v-if仅重新渲染当次，v-show相当于元素的display属性，只是样式上的显示或者隐藏。
这导致了它们的使用场景（不细致可以考虑本存在）不同，前者多用于使用渲染次数较少的环境，需要反复渲染的多用v-show，v-if会加大服务器压力等等。。
这里说项目当中遇到的两个场景：
1.使用v-if或者v-show做一个tab选项卡的切换
毫无疑问，这种场景下用v-show，因为一个选项卡中用户需要频繁切换，次数可能还相当大。当时在项目的需求当中，后端接口和前端这一块并不能做到tab1中的某个数据改变后，用户切换到tab2
后与这个数据相关的另一个数据即时改变，因为这两个tab是组件不是两个不同的页面，没法在create中重新刷新数据。
可行的方法是通过组件传值，可这样就很麻烦了，这里将父组件中的v-show换
成v-if，重新渲染当前组件，起到了一个局部渲染的作用。
2.使用v-show做一个点击到footer的5个按钮时分别显示不同的页面，相当于大组件
页面上就像调转到几个不同的页面（常见的app那种），但这里需求其实是一个页面中展示的不同组件！
在做每个页面（其实是组件）右侧边栏有一个按钮一直存在，点击时左侧均能划出80%宽的其他组件，所以得在5个组件都引入这个组件，而这个组件又恰巧因为内部某一部分只能展示展示在这几个
组件中的个别组件，这里的问题就是每次点击footer切换组件时，左侧都会划出其他组件的里的cover（现象是这样）。
可行方法是把左侧划出的组件拆了重写，也要改父组件，就相当于把山都挖了，
恐怖，效果还未知。。。。打印组件传值时发现cover的flag为true打印了五次，感觉是flag被每个组件重复传值了，所以在父组件中将v-show改用v-if，就像是将五个组件转换成5个页面，每次点击只
传值一次，，，，，，，解决了。
至于之后可能出现的问题，先不想。。。不想就没有问题
vue--v-if和v-show的区别（个人项目中的理解应用）
原文：https://www.cnblogs.com/wd163/p/12463096.html