v-show可以写在dom标签中，可以根据表达式的true还是false来判断是否显示该标签的内容
v-show是通过css属性的display来控制是否显示的，不删除元素
v-show：
在所写的代码中
按住f12选择样式，display被划掉了，元素被显示了
当display勾选的时候，元素不显示了
所以v-show更适合用于频繁的切换 -》 只修改了css样式，减少了其他消耗
v-show有更高的初始渲染消耗 -》无论表达式是true还是false，v-show的元素都被渲染了
v-if：
v-if切换有一个局部编译/卸载的过程，切换过程中合适地销毁和重建内部的事件监听和子组件;
v-if是惰性的，条件第一次变为真时才开始局部编译;
在上述代码中，执行如下图
当我们点击的时候，可以看到div元素中的内容发生了变化
把标签换成v-show试试呢
当我们点击测试if
可以看到div元素还是存在的，是在多了一个display的样式
总结：当元素在页面切换频繁时，使用v-show，当元素在页面只进行较少的变化次数时，使用v-if
标签：区别,样式,标签,元素,切换,show,display From： https://www.cnblogs.com/123-hh/p/18117276