后台列表里有一列操作按钮，只有管理员能看到，这种按条件渲染的需求，vue v-if 处理的就是它。但同事代码里用的是 v-show，页面跑起来效果一样，到底有什么区别，什么时候必须分清？
核心区别：真删还是藏
v-if 是惰性的，条件为假时节点根本不渲染，切换时真的销毁和重建 DOM；v-show 不管真假都渲染，只是切 display:none。所以 v-if 初始开销小、切换开销大，v-show 正好反过来。初始条件基本为假、很少切换的用 v-if；频繁切换的，比如标签页内容、悬浮提示，用 v-show 更划算。
v-if 的几个搭配
v-if 后面可以接 v-else-if 和 v-else，中间不能插别的元素，几个兄弟节点要紧挨着。多个元素想共用同一个条件，外面套一层 template：
<template v-if='login'> <span>欢迎回来</span> <a>退出登录</a> </template>
v-show 不支持 template 包裹，也没法接 v-else，这是它不如 v-if 灵活的地方。
和 v-for 同元素时的优先级
Vue 3 里 v-if 比 v-for 先执行，写在同一个元素上，v-if 里拿不到 v-for 的循环变量，直接报错。官方也不建议这么写，想过滤列表就先用 computed 处理数据，或者把 v-if 挪到内层元素上。Vue 2 的优先级正好相反，老项目迁移时这里特别容易踩坑。
实际项目里还有个常见误区：权限控制光靠 v-if 把按钮藏起来，接口那边不做校验的话，等于把门锁画在门上。前端的显示控制只管体验，真正的拦截必须在服务端做。
选型总结一句：切换频繁用 v-show，条件基本不变用 vue v-if，配合 v-else 系列指令能满足绝大多数分支渲染需求。