在 Vue 3 中，推荐使用 useSlots() 获取 slots 对象并判断插槽属性是否为真值来检测父组件是否传递了某插槽；如 !!slots.default 判断默认插槽，!!slots.header 判断具名插槽，中划线命名需用方括号访问；模板中应配合 v-if 控制插槽区域渲染，避免空节点。
在 Vue 3 中，判断父组件是否传递了某个插槽，最直接、推荐的方式是通过 useSlots() 获取插槽对象，再检查对应插槽名是否存在（即是否为真值）。
用 useSlots() 检查插槽存在性
在 <script setup> 中调用 useSlots()，返回一个 slots 对象，其每个属性（如 default、header、footer）对应一个插槽函数。如果父组件未提供该插槽内容，对应属性值为 undefined；提供了则为一个返回 VNode 数组的函数。
-
!!slots.default→ 判断是否有默认插槽内容 -
!!slots.header→ 判断是否传入了具名插槽header -
!!slots['my-slot']→ 支持中划线命名的插槽（需用方括号访问）
在模板中条件渲染插槽区域
利用上述判断结果，可控制插槽容器是否渲染，避免空 DOM 占位或样式错乱：
vue-composition-api-best-practices
下载
Vue 3 组合式 API 与 最佳实践，涵盖代码组织、useXxx 模式、组合式函数设计、Store 集成、响应式优化及功能抽取。
- 只在有内容时才渲染
<header>区域：<header v-if="hasHeaderSlot"><slot name="header"></slot></header> - 为插槽提供 fallback 内容：
<slot name="aside"><p>暂无侧边栏</p></slot>（注意：这不等于“检测”，而是兜底显示） - 避免对未定义插槽调用
<slot name="xxx"></slot>导致空白节点，建议配合v-if
注意作用域插槽的特殊性
作用域插槽（如 <slot name="item" :data="item"></slot>）即使被声明，只要父组件没用 v-slot:item 使用它，slots.item 依然为 undefined。所以检测逻辑完全一致，无需额外处理。
立即学习“前端免费学习笔记（深入）”；
不依赖渲染函数的轻量写法
若未使用 Composition API，也可在 Options API 的 render 函数中通过 this.$slots 访问（Vue 3 中已改用 slots 参数），但 useSlots() 是 setup 场景下最简洁、类型安全的方式。
