Vue3 条件渲染

v-if

v-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回真值时才被染。通俗来说就是在一个模块中添加 v-if 当满足条件时才执行(输出)。

 v-else

v-else 当上一个 v-if 不满足条件是执行 v-else ，当条件不满足时只会执行 最后一个 v-else

v-else-if 

v-else-if 当上一个 v-if 进行判断当上一个结果为felse后才来到 v-else-if 进行条件判断满足条件将执行渲染并不在进行判断如果全部判断都不满足则 执行 v-else

v-show

与 v-if 类型不过 v-if 不满足条件是不渲染 而 v-show 是隐藏也就是说v-if 是不会加载而 v-show 是加载之后根据条件是否显示 

示例