React 组件

UGFab 浮动操作组

用一个高优先级主动作展开少量快捷动作,支持显式状态、Escape、外部点击和扇形布局。

导入方式

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

tsx
import { UGFab, UGFabTrigger, UGFabActions, UGFabAction } from '@ug666/ui-react'

纵向快捷动作

点击主按钮展开;选择动作、Escape 或点击组件外部会关闭。

项目工作区

扇形布局

最多展示四个图标动作;每个图标按钮都必须有可访问名称。

属性

属性类型默认值说明
open / defaultOpenbooleanfalse控制或初始化展开状态。
layoutvertical | flowervertical纵向速度拨盘或最多四项的扇形布局。
placementbottom-start | bottom-endbottom-end使用逻辑方向定位,兼容 RTL。
strategyfixed | absolutefixed固定到视口或定位到局部相对容器。