v-if

v-if / v-if-else / v-else
写指令表达式，并且结构必需紧挨在一起
在没有标签时可以用 <template> 标签代替

v-if 是对 DOM 的移除和添加，在移除的时候用注释节点占位；
对内部的子组件与事件监听都会销毁与重建

v-if 只有条件是 truthy 的时候，才会渲染（惰性渲染）

v-show

v-show 总是会被渲染、用 display 来控制其显示与隐藏

区别

• v-if
  • 在切换的时候会提高开销，如果条件为假值，初始化渲染是不会进行的
  • 如果切换不频繁，（加载时不需要的视图），可以用 v-if
• v-show
  • 在切换的时候开销较低，但是初始化渲染时无论显示与否都要被渲染
  • 如果切换频繁就用 v-show