React 组件
UGIndicator 角标容器
把状态点、数量徽标或辅助操作定位到内容边缘,支持九个锚点与 RTL 逻辑方向。
导入方式
按需从包入口导入组件,并在应用入口引入一次样式文件。
tsx
import { UGIndicator, UGIndicatorItem } from '@ug666/ui-react'数量与状态
角标内容可直接组合 Badge、状态点或业务按钮。
12
UG
九个锚点
逻辑 start / end 在 RTL 页面中会自动镜像。
内容区域
属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| UGIndicator.as | ElementType | div | 设置根元素或自定义组件。 |
| UGIndicatorItem.as | ElementType | span | 设置角标承载元素。 |
| horizontal | start | center | end | end | 逻辑水平方向锚点,自动适配 RTL。 |
| vertical | top | middle | bottom | top | 垂直方向锚点。 |