导航菜单
@astryxdesign/core v0.7.1 · NavMenu
NavMenu Props
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
label | string | - | 菜单的无障碍名称。 |
size | 'sm' | 'md' | 'lg' | 'md' | 菜单宽度档。 |
focusRequest | 'first' | 'last' | null | null | 打开后把焦点放到第一项或最后一项。 |
NavMenu 事件
| 名称 | 说明 |
|---|---|
close | 按下 Escape 时触发。由 NavDisclosure 接住并关闭面板。 |
NavMenuItem Props
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
label | string | - | 菜单项文字。 |
description | string | - | 显示在文字下面的辅助说明。 |
href | string | - | 有地址时渲染成链接。 |
as | NavLinkComponent | 'a' | 链接根组件。 |
iconClass | string | - | 图标 CSS class。 |
isDisabled | boolean | false | 禁用。键盘导航会跳过。 |
keepOpen | boolean | false | 选中后不关闭菜单。 |
isMenuItem | boolean | true | 在菜单里是 menuitem。抽屉里设为 false。 |
NavDisclosure Props
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
label | string | - | 弹出层的无障碍名称。 |
placement | 'above' | 'below' | 'start' | 'end' | 'below' | 相对触发器的位置。 |
alignment | 'start' | 'center' | 'end' | 'start' | 沿交叉轴的对齐。 |
hover | boolean | false | 悬停一段时间后打开,离开后关闭。 |
showDelay | number | 150 | 悬停打开前的等待,毫秒。 |
hideDelay | number | 200 | 指针离开后的关闭等待,毫秒。 |
NavHeadingMenu Props
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
label | string | - | 菜单的无障碍名称。 |
size | 'sm' | 'md' | 'lg' | 'md' | 菜单宽度档,也会传给每一项的内边距。 |
minWidth | number | string | - | 覆盖按档位算出的最小宽度。数字按像素。 |
focusRequest | 'first' | 'last' | null | - | 打开后聚焦第一项或最后一项。放在标题菜单插槽里时,标题会传入这个值。 |
NavHeadingMenu 事件
| 名称 | 说明 |
|---|---|
close | 按下 Escape 时触发。 |
NavHeadingMenuItem Props
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
label | string | - | 主文字。默认插槽优先。 |
description | string | - | 主文字下面的辅助说明。 |
href | string | - | 有地址时渲染成链接。 |
as | NavLinkComponent | 'a' | 链接根组件。 |
iconClass | string | - | 图标 CSS class。 |
isDisabled | boolean | false | 禁用。方向键和首字母查找会跳过。 |