v-if
<h1 v-if="ok">Yes</h1>
切换多个元素://最终的渲染结果不会包含<template>元素
<template v-if="ok">
<h1>Title</h1>
<p>Paragraph </p>
<p>Paragraph </p>
</template>
//v-else,v-else-if元素必须紧跟在v-if或者v-else-if元素的后面——否则它将不会被识别
<div v-if="type === 'A'">A</div>
<div v-else-if="type === 'B'">B</div>
<div v-else>Not A/B</div>
在v-if，v-else下的元素，vue会尽可能复用同一元素，切换属性内容而不切换元素本身;添加一个具有唯一值的 key,可以正常切换
<template v-if="loginType === 'username'">
<label>Username</label>
<input placeholder="Enter your username" key="username-input">
</template>
<template v-else>
<label>Email</label>
<input placeholder="Enter your email address" key="email-input">
</template>
//输入框将重新渲染，<label>元素仍然会被高效地复用，因为它们没有添加key属性
v-show
<h1 v-show="ok">Hello!</h1>
v-show 不支持 <template>,元素总是会被渲染，并且只是简单地基于 CSS 进行切换
如果需要非常频繁地切换，则使用v-show较好；如果在运行时条件不太可能改变，则使用v-if较好。