加载器

加载器表示未指定等待时间或显示过程长度。

Storybook@heroui/spinnerServer componentSourceStyles source

安装

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

引入

用法

注意：Spinner 默认将 Loading 设置为 aria-label。这是出于可访问性要求。您可以通过传递 label 或 aria-label 属性来更改此标签。

尺寸

颜色

带标签

标签颜色

变体

插槽

  • base：spinner 的基础插槽，包裹圆圈和标签。
  • wrapper：圆圈的外层包装。
  • circle1：spinner 组件的第一个圆圈。（仅在 variant 为 default 或 gradient 时生效）
  • circle2：spinner 组件的第二个圆圈。（仅在 variant 为 default 或 gradient 时生效）
  • dots：spinner 组件的点。（仅在 variant 为 wave 或 dots 时生效）
  • spinnerBars：spinner 组件的条形。（仅在 variant 为 spinner 时生效）
  • label：标签内容。

API

Spinner Props

PropTypeDefault
label
string
size
sm | md | lg
"md"
color
default | primary | secondary | success | warning | danger
"primary"
variant
default | simple | gradient | wave | dots | spinner
"default"
labelColor
default | primary | secondary | success | warning | danger
"default"
classNames
Partial<Record<'base' | 'wrapper' | 'circle1' | 'circle2' | 'dots' | 'spinnerBars' | 'label', string>>
Spacer 间距Switch 开关