Vue 条件渲染（v-if 与 v-show）——Vue 学习笔记（六）

v-if

v-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 truthy 值的时候被渲染。例如:

不推荐同时使用 v-if 和 v-for，当 v-if 与 v-for 一起使用时，v-for 具有比 v-if 更高的优先级。

---

（1）在 <template> 元素上使用 v-if 条件渲染分组

因为 v-if 是一个指令，所以必须将它添加到一个元素上。

如果想渲染多个元素，可以把一个 <template> 元素当作不可见的包裹元素，并在上面使用 v-if，最终的渲染结果将不包含 <template>。

（<template> 标签在没有引用 vue.js 的界面表现为不会渲染任何信息，因为此标签天生不可见，默认 display: none，不过可以用 js 对其进行操作）