我们之前说过控制元素显示隐藏的指令v-if，这节课我们对v-if的其他内容做一个简单的补充

1.v-else

v-if和JavaScript里的if类似，也有if else的写法
举个例子，我们有一个数据status，表示一个状态

data(){
  return {
    status: 1
  }
}

我们要根据状态显示一些文字，判断status是1，显示一个div，如果不是1，显示另外一个div，可以使用v-else

<div v-if="status===1">状态是1时，显示的内容</div>
<div v-else>状态不是1时，显示的内容</div>

当然，对于更多的状态，还可以写v-else-if，这一点也和JavaScript类似

<div v-if="status===1">状态是1时，显示的内容</div>
<div v-else-if="status===2">状态是2时，显示的内容</div>
<div v-else>状态不是1也不是2时，显示的内容</div>

v-else和v-else-if使用时，必须跟在使用v-if或v-else-if的元素后面

2.使用<template>元素同时控制对个元素的显示隐藏

如果我们有连续的多个元素，同时要控制它们的显示隐藏时，可以这样写

<template v-if="ok">
  <h1>Title</h1>
  <p>Paragraph 1</p>
  <p>Paragraph 2</p>
</template>

只用写一个v-if，代码简洁多了，跟我们之前在循环中使用template一样，它是一个虚拟元素，不会渲染到页面上。

这节课的内容就是这些了