Skeleton 场景示例

这页不再重复 xy-skeleton 的基础 API，而是直接把它放回一个控制台混合页里，看它如何承接指标卡、任务队列和摘要区块。完整属性说明仍然放在 Skeleton 骨架屏 页面。

顶部概览Card / Skeleton / Tag

任务队列列表骨架 / 自定义模板 / 文本占位

摘要区块详情提示 / 按钮 / 段落骨架

推荐阅读路径

1. 先看顶部概览卡，判断 Skeleton 放在 KPI 区时需要什么结构。
2. 再看中间任务队列，理解列表区更适合默认模板还是自定义 template。
3. 最后看右侧摘要块，确认详情区和动作区如何稳定占位。

完整场景

这个示例把 KPI 卡、发布任务队列和右侧摘要块放在同一页里，适合拿来做控制台、发布中心或任务中心的骨架态原型。

发布控制台

同一屏里同时承接 KPI、任务队列和摘要区块，是 Skeleton 在后台页面最常见的落点。

生产环境波次 A最近 24 小时控制台加载中

发布任务队列波次 A

摘要与建议需关注

适用边界

• 控制台首页、发布中心、任务中心这类“页面结构固定，但接口返回较慢”的后台页面。
• 同一屏里既有指标卡、又有列表区和右侧摘要区，需要统一 loading 反馈的场景。
• 不适合表达步骤依赖、流程编排或时间轴关系的复杂流程型页面。
• 不适合页面结构完全未知，或已经有稳定缓存数据、不需要额外占位的场景。

数据流说明

1. 页面层维护真实 loading 状态，并决定哪些区块仍在等待数据。
2. xy-skeleton 只负责承接占位反馈，不处理请求和数据同步逻辑。
3. 当 loading 切到 false 时，默认插槽直接回到真实内容区，不再重复维护两份页面结构。

可复用模块

1. 顶部 KPI 卡骨架模板，适合控制台首页和状态面板先稳住布局。
2. 列表 / 表格区的批量占位模板，适合任务中心、发布队列和审核台。
3. 右侧摘要块的文本 + 按钮骨架，适合详情抽屉、说明区和推荐动作面板。