设计
设计指南
设计原则
样式指南
设计资源
Klein - Figma
Klein Font
官方图标库
开发
开发文档
React
Vue Web
敬请期待
开发资源
GitHub 代码仓库
生态产品
生态产品
Orion Fonts
敬请期待
Orio Market
敬请期待
Klein Pro
敬请期待
Klein Editor
敬请期待
菜单 Menu
为页面和功能提供导航的菜单列表。
顶部导航：水平的顶部导航菜单。
顶部导航
水平的顶部导航菜单。
Menu Props
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| theme | 主题色 | "light" | light |
| mode | 菜单类型 | "vertical" | vertical |
| prefixCls | 自定义样式前缀 | string | - |
| className | 自定义 className | string | - |
| style | 自定义 style | CSSProperties | - |
| inlineCollapsed | inline 时菜单是否收起状态 | boolean | - |
| expandIcon | 自定义展开图标 | ReactNode | - |
| defaultOpenKeys | 初始展开的 SubMenu 菜单项 key 数组 | string[] | - |
| defaultSelectedKeys | 初始选中的菜单项 key 数组 | string[] | - |
| inlineIndent | inline 模式的菜单缩进宽度 | number | 26 |
| selectedKeys | 当前选中的菜单项 key 数组 | string[] | - |
| openKeys | 当前展开的 SubMenu 菜单项 key 数组 | string[] | - |
| multiple | 是否允许多选 | boolean | false |
| triggerSubMenuAction | SubMenu 展开/关闭的触发行为 | "hover | - |
| onClick | 点击 MenuItem 调用此函数 | ((e: EventProps) => void) | - |
| onDeselect | 取消选中时调用，仅在 multiple 生效 | ((e: EventProps) => void) | - |
| onOpenChange | SubMenu 展开/关闭的回调 | ((openKeys: string[]) => void) | - |
| onSelect | 被选中时调用 | ((e: EventProps) => void) | - |
MenuItem Props
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| key | item 的唯一标志 | string | - |
贡献者
