必须紧挨着
<div v-if="type === 'A'">
A
</div>
<div v-else-if="type === 'B'">
B
</div>
<div v-else-if="type === 'C'">
C
</div>
<div v-else>
Not A/B/C
</div>分组
<template v-if="ok">
<h1>Title</h1>
<p>Paragraph 1</p>
<p>Paragraph 2</p>
</template>Vue 会复用已有元素来快速渲染
<template v-if="loginType === 'username'">
<label>Username</label>
<input placeholder="Enter your username">
</template>
<template v-else>
<label>Email</label>
<input placeholder="Enter your email address">
</template>上面的两个输入框切换时，新的输入框只是把老的输入框改改不一样的属性就拿来用，所以老输入框已有的东西都会保留，这里是输入内容不会删除。如果不想这样，加上key=“”就行
<h1 v-show=true>Hello!</h1>
注意，v-show 不支持 <template> 元素，也不支持 v-else。
v-if 有更高的切换开销，而 v-show 有更高的初始渲染开销。因此，如果需要非常频繁地切换，则使用 v-show 较好；如果在运行时条件很少改变，则使用 v-if 较好。
评论区