直接在标签内写内容是最标准的后备内容设置方式，仅当父组件未传入任何节点（含空格、换行、注释）时才渲染，默认、具名、作用域插槽均支持，但作用域插槽默认内容不可访问作用域变量。
直接在 <slot></slot> 标签内部写内容，就是最标准、最可靠的设置方式。
基础写法：默认插槽后备内容
在子组件模板里，把想作为“保底”的文本或结构写进 <slot></slot> 标签中间：
-
<slot>暂无内容，请传入信息</slot>—— 父组件完全没传任何内容时，这句话就会显示 -
<slot><h3>默认标题</h3> <p>这里是简介</p><div class="aritcle_card flexRow artxards"> <div class="artcardd flexRow"> <a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill8748" title="vue-composition-api-best-practices"><img src="https://img.php.cn/upload/skill/000/000/081/179222222327548.jpg" alt="vue-composition-api-best-practices" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a> <div class="aritcle_card_info flexColumn"> <a rel="nofollow" href="/xiazai/skill8748" title="vue-composition-api-best-practices" class="overflowclass">vue-composition-api-best-practices</a> <p class="overflowclass">Vue 3 组合式 API 与 <script setup> 最佳实践，涵盖代码组织、useXxx 模式、组合式函数设计、Store 集成、响应式优化及功能抽取。</p> </div> <a rel="nofollow" href="/xiazai/skill8748" title="vue-composition-api-best-practices" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div></slot>—— 支持 HTML 结构，不局限于纯文本 - 父组件写成
<mycomp></mycomp>或<mycomp></mycomp>（空标签），后备内容就生效
具名插槽也支持各自独立的后备内容
每个具名插槽的 fallback 是互不影响的，只需在对应 <slot name="xxx"></slot> 内填写：
<slot name="header"><h2>默认页头</h2></slot><slot name="footer"><button>确认</button></slot>- 父组件只传了
#header，#footer仍会渲染它的默认按钮 - 注意：
name必须是静态字符串，<slot :name="xxx"></slot>不会触发 fallback
作用域插槽的默认内容限制与写法
作用域插槽可以设默认文本，但不能访问其作用域变量：
- ✅ 正确：
<slot v-bind:item="currentItem">暂无数据</slot> - ❌ 错误：
<slot v-bind:item="currentItem">{{ item.name }}</slot>—— 编译报错或留空 - 如需更灵活控制，可用
v-if="$slots.default"或v-if="$slots.item"包裹真实内容，再配普通元素做 fallback
为什么写了却看不到？关键排查点
后备内容不出现，通常不是语法错，而是 Vue 判定“已有内容”：
- 父组件写了
<mycomp>\n </mycomp>—— 换行+空格 = 文本节点 → fallback 跳过 - 用了
v-show包裹插槽内容 → DOM 节点仍在 → 不触发 fallback - 用了
v-if="false"→ 节点未创建 → fallback 正常显示 - 子组件漏写
<slot></slot>标签 → 内容被丢弃，不是 fallback 失效，是根本没入口
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
