v-slot 是 Vue 3 插槽标准写法，支持默认插槽（直接写标签内）、具名插槽（#header）、作用域插槽（#default="{user}" 或简写 #="{user}"）及动态插槽名（#[name]）。
v-slot 指令是 Vue 3 中插槽的标准写法，它统一了 Vue 2 的 slot 和 slot-scope 语法，语义更清晰、结构更简洁。最常用的是它的简写形式 #，能显著减少模板冗余。
默认插槽直接写在组件标签内
子组件中用 <slot></slot> 定义位置，父组件无需任何指令，内容直接写在子组件标签内部即可生效：
- 子组件（Card.vue）：
<div class="card"><slot>默认标题</slot></div> - 父组件调用：
<Card>我的卡片内容</Card> - 若没传内容，就会显示“默认标题”
具名插槽用 #插槽名 替代 v-slot:插槽名
当子组件有多个插槽时，给 <slot name="header"></slot> 命名后，父组件用 #header 快速绑定内容：
- 子组件定义：
<header><slot name="header"></slot></header> - 父组件写法：
<template #header><h2>页面顶部</h2></template> - 支持多个具名插槽并存，比如同时写
#header、#footer、#aside
作用域插槽传参也支持 #简写
子组件通过 <slot :user="userInfo" :level="1"></slot> 暴露数据，父组件用 #default="{ user, level }" 解构接收：
立即学习“前端免费学习笔记（深入）”；
<template #default="{ user, level }"><p>{{ user.name }} (Lv.{{ level }})</p></template>- 若只用一个插槽且带作用域，
#default可省略为#，即<template #="{ user }">...</template> - 注意：必须用
<template>包裹，不能直接在组件标签内写带解构的表达式
动态插槽名用 #[动态变量] 绑定
当插槽名需要根据状态切换时，可把 name 属性设为响应式变量，父组件用方括号语法匹配：
- 子组件：
<slot :name="currentSlotName"></slot>（其中 currentSlotName 是 ref 或 computed） - 父组件：
<template #[currentSlotName]>动态内容</template> - 适用于 tab 切换、主题切换等需按条件渲染不同插槽内容的场景
