v-if 用于条件渲染，不满足时彻底移除 dom；v-show 始终渲染，仅切换 display 样式。v-if 适合低频切换或初始不显示场景，v-show 适合高频显隐操作。
直接用表达式控制真假值就能让元素显示或隐藏，但选 v-if 还是 v-show，关键看“要不要真删掉它”。
v-if：条件成立才渲染，不成立就彻底移除
v-if 会根据表达式结果决定是否把元素插入 DOM。为 false 时，元素连同内部的事件监听器、子组件、指令一起被销毁；为 true 时，重新创建并挂载。
- 支持多分支：
v-else-if和v-else必须紧跟在前一个条件指令之后，不能隔开 - 适合用在切换不频繁的场景，比如登录态切换、页面级模块开关
- 可配合
<template></template>包裹多个元素，避免额外标签污染结构 - 初始为 false 时不消耗渲染资源，但每次切换都有重建成本
v-show：始终渲染，只改 display 样式
v-show 不管条件真假，元素一定出现在 DOM 中，只是通过 CSS 的 display: none 或恢复默认值来控制显隐。
- 切换极快，适合高频操作，比如折叠面板、表单项切换、按钮状态提示
- 不支持
<template></template>，必须作用在真实元素上 - 即使隐藏，元素仍参与文档流计算（如影响父容器高度），且绑定的数据、事件都持续运行
- 初始渲染比 v-if 稍重，因为不管用不用，都得先画出来
怎么选：看使用频率和资源敏感度
如果这个区域很少显示/隐藏，或者首次加载时大概率不显示（比如错误提示、管理后台的高级设置），优先用 v-if；如果用户会反复点开收起（比如侧边栏菜单、搜索建议、弹窗内容），那就用 v-show 更合适。
注意：v-show 不能用于组件时搭配 v-else，否则 else 块无法识别——此时应改用两个 v-show，比如 v-show="show" 和 v-show="!show"。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
