骨架

Skeleton 是用来表示加载状态并展示组件预期形状的占位符。

安装

The above command is for individual installation only. You may skip this step if @heroui/react is already installed globally.

引入

用法

单独使用

Skeleton 默认会采用其 children 组件的形状，但你也可以将其作为单独的组件使用。

已加载状态

你可以使用 isLoaded 属性来停止骨架动画并显示子组件。

插槽

• base：骨架的基底插槽，包含 before 和 after 伪元素以创建动画。
• content：包裹的组件，用于显示骨架形状，仅当 isLoaded 为 true 时可见。

数据属性

Skeleton 在 base 元素上具有以下属性：

• data-loaded： 表示骨架的加载状态，基于 isLoaded 属性。

API

Skeleton Props