| v-if | v-show | |
| 方法 | 通过控制dom节点是否存在控制元素是否显示 | 通过控制dom元素的display样式控制元素是否显示 |
| 渲染 | v-if是惰性的，根据条件渲染切换中销毁或者重建子组件，v-if条件为假时是不编译 | 始终存在只是改变css样式，始终编译会被缓存 |
| 性能消耗 | 较多的切换消耗 | 较多的初始化渲染消耗 |
| 使用场景 | 运行时条件改变较少，多条件判断时 | 运行时条件多次改变(频繁操作dom对性能影响很大) |
| 注意事项 | 当出现v-show 以及v-if 不生效，没有根据数组中的值的变化而变化时，请检查数组中的值的变化是否是通过Vue.set来执行修改
以下代码中 <div v-show="lists[0].show"></div> 正确的写法应该如下 list=lists[0] Vue.set(list,"show",true) |
|
| v-if能和v-else连用进行分支判断 | v-show是不能和v-else连用的 | |