UG666

UG666 UI

React 组件

UGSpinner 加载

UGSpinner 用于局部加载反馈,适合按钮、列表或页面模块中使用。

导入方式

按需从包入口导入组件,并在应用入口引入一次样式文件。

tsx
import { UGSpinner } from '@ug666/ui-react'

变体预览

不同尺寸的旋转加载图标。

状态展示

通过颜色区分处理中、成功前等待与高优先级任务。

尺寸展示

组件内置 sm / md / lg 三档尺寸。

代码示例

适合搭配按钮或卡片局部占位。

tsx
import { UGSpinner } from '@ug666/ui-react'

export function LoadingState() {
  return <UGSpinner size="lg" className="text-primary" />
}

Props

属性类型默认值说明
size'sm' | 'md' | 'lg''md'控制加载图标尺寸。
labelstring'加载中'用于无障碍描述。
classNamestring扩展颜色与附加动画样式。