十二、条件渲染

（一）v-if

1.写法

• v-if="表达式"
• v-else-if="表达式"
• v-else="表达式"

2.适用于

• DOM 元素是否显示的切换频率较低的场景

3.特点

• 不展示的 DOM 元素直接被移除

4.注意

• v-if 可以和：v-else-if、v-else 一起使用
• 但要求结构不能被其他元素“打断”

（二）v-show

1.写法

• v-show="表达式"

2.适用于

• DOM 元素是否显示的切换频率较高的场景

3.特点

• 不展示的 DOM 元素未被移除，仅仅是使用样式隐藏掉

注意

使用 v-if 时，元素可能无法获取到，而使用 v-show 一定可以获取到