v-slot 的语法糖 # 仅适用于具名插槽且插槽名为合法标识符（如 header、footer），不可用于动态插槽名、默认插槽或作用域插槽解构；默认插槽应直接写内容或用 v-slot:default，禁用 #default。
Vue 中 v-slot 的语法糖就是用 # 符号代替 v-slot:，但必须严格满足两个前提：只用于具名插槽、且插槽名是合法的标识符（不能含空格、特殊符号或数字开头）。
哪些情况能安全缩写为 #
只要子组件定义了带 name 的插槽，父组件中就可以用 #xxx 替代 v-slot:xxx：
-
<template v-slot:header>...</template>→<template>...</template> -
<template v-slot:footer>...</template>→<template>...</template> -
<template v-slot:actions>...</template>→<template>...</template>
注意：# 后面直接跟插槽名，**不加引号**，也不加括号。比如 #user-info 是非法的（含短横线），#1st 也不行（数字开头）。
哪些情况不能缩写
以下情形必须写完整 v-slot: 形式，不可用 #：
立即学习“前端免费学习笔记（深入）”；
蓝湖代码转vue2.0+element-ui
下载
将静态 Vue 页面(index.vue)改造为动态页面(Custom.vue)；稿源仅限 index.vue、其引用的 CSS 与资源路径，禁止参考仓库内其他文件。Invoke when user wants to transform a static Vue page into a dynamic data-driven page with Element UI components.
- 动态插槽名，例如
v-slot:[dynamicName]—— 这里必须保留方括号语法，#[dynamicName]不合法 - 默认插槽（无 name）——
v-slot:default可以写，但不能简写成#default或#；更常见的是直接省略指令，用匿名模板或裸内容 - 作用域插槽传递参数时，如
v-slot="{ item }"—— 这属于解构写法，和#无关，不能缩写
默认插槽怎么写才规范
默认插槽本身没有名字，所以它天然不参与 # 缩写体系。推荐两种写法：
- 最简洁：直接把内容写在组件标签内（不包
<template></template>），前提是子组件只有一个<slot></slot> - 显式声明：用
<template v-slot:default>...</template>，适合需要和具名插槽并列书写、或避免歧义的场景
错误示例：<template></template> 虽然部分版本能运行，但不符合 Vue 官方文档推荐写法，易引发维护困惑。
实际组合写法示例
一个卡片组件同时使用默认插槽 + 两个具名插槽，规范缩写如下：
<Card> <template #header><h3>用户信息</h3></template> <template #footer><button>确认</button></template> <p>这是默认插槽内容，直接写在这里</p> </Card>
这里 #header 和 #footer 是合规缩写，而段落内容走默认插槽路径，干净又明确。
