v-slot 的语法糖 # 仅适用于具名插槽且插槽名为合法标识符（如 header、footer），不可用于动态插槽名、默认插槽或作用域插槽解构；默认插槽应直接写内容或用 v-slot:default，禁用 #default。

Vue 中 v-slot 的语法糖就是用 # 符号代替 v-slot:，但必须严格满足两个前提：只用于具名插槽、且插槽名是合法的标识符（不能含空格、特殊符号或数字开头）。

哪些情况能安全缩写为 #

只要子组件定义了带 name 的插槽，父组件中就可以用 #xxx 替代 v-slot:xxx：

• →
• →
• →

注意：# 后面直接跟插槽名，**不加引号**，也不加括号。比如 #user-info 是非法的（含短横线），#1st 也不行（数字开头）。

哪些情况不能缩写

以下情形必须写完整 v-slot: 形式，不可用 #：

• 动态插槽名，例如 v-slot:[dynamicName] —— 这里必须保留方括号语法，#[dynamicName] 不合法
• 默认插槽（无 name）—— v-slot:default 可以写，但不能简写成 #default 或 #；更常见的是直接省略指令，用匿名模板或裸内容
• 作用域插槽传递参数时，如 v-slot="{ item }" —— 这属于解构写法，和 # 无关，不能缩写

默认插槽怎么写才规范

默认插槽本身没有名字，所以它天然不参与 # 缩写体系。推荐两种写法：

Antd Vue Components

学习并查找 ant-design-vue（Vue 3）组件的使用方式，包括变体、运行示例、Vue 3 SFC 代码以及关键 props/events/slots。当用户询问如何使用 ant-design-vue 时使用。

下载

• 最简洁：直接把内容写在组件标签内（不包 ），前提是子组件只有一个
• 显式声明：用 ，适合需要和具名插槽并列书写、或避免歧义的场景

错误示例： 虽然部分版本能运行，但不符合 Vue 官方文档推荐写法，易引发维护困惑。

实际组合写法示例

一个卡片组件同时使用默认插槽 + 两个具名插槽，规范缩写如下：

<card><template><h3>用户信息</h3></template><template><button>确认</button></template><p>这是默认插槽内容，直接写在这里</p>
</card>

这里 #header 和 #footer 是合规缩写，而段落内容走默认插槽路径，干净又明确。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！