骨架屏
Props
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
width | number | string | '100%' | 占位块的宽度。传入数字时按像素处理,字符串则保留为 CSS 尺寸。 |
height | number | string | '100%' | 占位块的高度。传入数字时按像素处理,字符串则保留为 CSS 尺寸。 |
radius | 'none' | 0 | 1 | 2 | 3 | 4 | 'rounded' | 3 | 圆角使用设计令牌等级,none 为直角,rounded 为完全圆角。 |
index | number | 0 | 交错动画的索引,每增加 1,动画延后 100ms,让多个占位块依次闪烁。 |
无障碍
Skeleton默认设置aria-hidden="true"。- 辅助技术不会读取默认的占位块。
- 外围加载区域必须提供名称。
- 外围加载区域必须设置
aria-busy="true"。 - 系统启用「减少动态效果」时,脉冲动画停止。
- 系统启用强制颜色模式时,占位块保持可见。
原生属性
根元素为 <div>。
以下内容传入根元素:
- HTML 属性。
aria-*属性。data-*属性。class。style。- 原生事件监听器。
传入 aria-hidden 时,该值覆盖默认值。