category: Components type: UI Views component: Base chinese: 导航(收纳式) english: StorageNav
收纳式导航组件。
规则
该组件类似于 Overlay
,通过外部控制其 visible
属性来决定其显示或隐藏。
API
StorageNav
成员 | 说明 | 类型 | 默认值 |
---|---|---|---|
visible | 是否显示导航浮层 | boolean |
false |
onClose | 在鼠标离开菜单(参见 mouseLeaveTimeout 属性))或者点击关闭按钮导致导航浮层关闭的时候触发的回调 | () => void |
默认不执行任何操作 |
closeIcon | 配置浮层左上角显示的关闭图标 |
string 或组件 |
category |
mouseLeaveTimeout | 鼠标指针离开浮层一段时间后,浮层会自动关闭。本属性配置鼠标离开后等待多长时间,单位为毫秒,为 0 时则禁用该功能,即不会在鼠标离开菜单后自动隐藏(用户此时便可完全控制何时隐藏菜单) |
number |
300 |
hoveredKey | 当前哪一个 Item 处于激活状态,设置该属性则当前展开值为受控状态 | string |
N/A |
onHover | 用户移动鼠标,悬浮在其他 Item 上时触发的回调 | (hoveredKey: string) => void |
N/A |
menuOpenTimeout | 切换菜单时的延迟,单位为毫秒,用于避免鼠标指针划过菜单区域时过于频繁地切换菜单导致的不便 | number |
128 |
onMouseEnter | 鼠标指针移入菜单浮层时触发的回调 | (e: Event) => void |
N/A |
onMouseLeave | 鼠标指针移出菜单浮层时触发的回调 | (e: Event) => void |
N/A |
onMouseMove | 鼠标指针在菜单浮层中移动时触发的回调 | (e: Event) => void |
N/A |
canCloseByIconClick | 是否允许点击左上角的图标来触发 onClose 回调关闭菜单浮层。为 false 时则图标仅作展示作用,无行为 |
boolean |
false |
StorageNav.Item
成员 | 说明 | 类型 | 默认值 |
---|---|---|---|
title | 菜单上显示的内容 | ReactNode | N/A |
onClick | 点击菜单项的回调 | (e: Event) => void |
默认不执行任何操作 |