FloatButton 浮动按钮

悬浮在页面角落，用于触发全局或核心操作。

基础用法

最简单的悬浮按钮。

类型与形状

支持 primary、success、warning、danger、info 及 default 类型。 支持 circle (默认) 和 square 形状。 可以使用自定义图标。

菜单模式

设置 menu-items 属性来开启菜单模式。 支持 click (默认) 和 hover 两种触发方式。

可拖拽与磁吸 (Unique)

设置 draggable 属性使按钮可拖拽。 开启 magnetic 属性后，释放时会自动吸附到最近的屏幕边缘（左/右）。

毛玻璃效果 (Unique)

设置 glass 开启毛玻璃拟态风格，适合现代感强的 UI。

带描述

可以在按钮下方添加简短描述。

FloatButton 属性

属性名	说明	类型	默认值
type	按钮类型	'primary' / 'success' / 'warning' / 'danger' / 'info' / 'default'	'primary'
shape	形状	'circle' / 'square'	'circle'
icon	图标组件	Component	-
description	描述文本	string	-
draggable	是否开启拖拽	boolean	false
magnetic	是否开启磁吸 (需配合 draggable)	boolean	false
glass	是否开启毛玻璃效果	boolean	false
right	默认右侧距离 (px)	number	40
bottom	默认底部距离 (px)	number	40
tooltip	悬浮提示文本	string	-
href	跳转链接	string	-
target	链接跳转方式	string	'_blank'
absolute	是否绝对定位 (相对于父元素)	boolean	false
trigger	菜单触发方式	'click' / 'hover'	'click'
menu-items	菜单项配置数组	MenuItems[]	[]

FloatButton 事件

事件名	说明	回调参数
click	点击时触发	(e: MouseEvent)
drag-start	开始拖拽时触发	(pos: {x, y})
drag-end	结束拖拽时触发	(pos: {x, y})

MenuItems 配置项

属性名	说明	类型
icon	图标组件	Component
description	描述/提示文本	string
type	按钮类型	string
click	点击回调	(e: MouseEvent) => void