插槽 Slots（default / named / scoped）
是，当前这里的 slot 是真实渲染。父组件传进来的不是字符串模板，而是实际的 JSX / renderable；宿主组件内部的 Slot 会在运行时把它取出来并直接渲染。
先看最小例子
把 slot 理解成“组件内部预留的洞口”。父组件传什么，洞口里就显示什么；没传就显示 fallback。
1. default slot
直接写在组件标签内部的内容，会落到默认插槽。
默认标题
没传 title slot，就显示这里。
这段内容就是 default slot。
默认底部
2. named slot
给某个直接子节点写 slot="name"，它就会去对应的命名插槽。
自定义标题
中间这段还是 default slot。
自定义底部
3. scoped slot
宿主组件把数据通过 props 传给 Slot；父组件用同名函数 prop 接住它。
- 37%CPU来自 scoped slot props
- 1.2GB内存来自 scoped slot props
如果只想先会用，记住这三条就够了：标签里的普通内容是 default slot，slot="name" 是 named slot，同名函数 prop 是 scoped slot。
再看完整例子
下面把 default、named、scoped、fallback 都放在一个组件里，看完整交互会更直观。
传入 slot 之后
自定义内容生效支付面板
Template slot="title" 可以一次传多个兄弟节点。
default slot 负责主体内容；这里放的是正文、统计块和说明文本。
可用率
99.98%
过去 24 小时
峰值请求
18k
每分钟
- 128msP95 延迟来自 scoped slot props
- 0.18%错误率来自 scoped slot props
- 3待处理告警来自 scoped slot props
未传 slot 时
fallback 接管默认标题
没有提供 title slot 时，会显示这段 fallback。
fallback action
默认插槽为空时，这里显示主体内容的 fallback。
- P95 延迟128ms
- 错误率0.18%
- 待处理告警3
当前推荐写法
- default slot直接写在组件标签内部，最终会落到 props.children。
- named slot单个节点可以直接写 slot="name"，多个兄弟节点建议用 Template slot="name" 包起来。
- scoped slot当前最稳妥的是传同名函数 prop，例如把 row 作为函数属性传给宿主组件。
- fallback宿主组件内部在 Slot 标签里写的 children，就是 slot 缺失时的回退内容。
这页实际演示的协议
静态命名内容走 slot="name" 和 Template slot="name"，作用域行模板走 row 函数 prop。
<Slot source={props} name="title">fallback</Slot><Template slot="title"><h2>支付面板</h2><p>多个兄弟节点</p></Template><button slot="actions">刷新</button><SlotPanel row={(slotProps) => <strong>{slotProps.label}: {slotProps.value}</strong>}><p>default slot 内容</p></SlotPanel>这也解释了为什么当前 demo 会同时出现 slot 属性和函数 prop 两种形式：前者覆盖命名静态内容，后者负责 scoped slot。