Menu
Props
| Prop Name | Type | Required | Default | Description |
|---|---|---|---|---|
| selectedKeys | Key[] | 选中的菜单项的key，controlled | ||
| defaultSelectedKeys | Key[] | [] | 默认选中的菜单项的key，uncontrolled | |
| onChange | (keys: Key[]) => void | 选中变化时的回调 | ||
| multiple | boolean | false | 是否支持多选 | |
| selectable | boolean | true | 是否可选 | |
| showSelectAll | boolean | Element | 是否显示全选，多选时有效 | ||
| block | boolean | 是否使用块元素显示模式，去除宽高限制，撑满容器，去除外阴影、border，方便放置在自定义容器中 | ||
| disabled | boolean | 是否禁用 | ||
| collapseProps | CollapseProps | collapse 的配置，参考 collapse 组件 | ||
| virtualList | | boolean | { // 简易模式，如确认每个 item 高度一致且不会变化可启用，可一定程度上优化性能 simple?: true; // 虚拟滚动的高度，默认为 200 height?: number; } | 启用虚拟滚动，启用后需要注意所有 item 需提供 key（可不提供 itemKey 和 subMenuKey，会使用 key 作为对应），且 Item key 和 SubMenu 不可重复，目前不支持 collapse 类 SubMenu | ||
| customStyle | { /** 菜单的最大高度 */ maxHeight?: string; /** 菜单的最大宽度 */ maxWidth?: string; } | 自定义样式 |
说明
这是 Menu 菜单组件
演示
演示
multiple - 支持多选
selectedKeys / defaultSelectedKeys - 选中的菜单项的 key (受控 / 非受控)
selectable - 是否可选
collapse - 折叠配置
showSelectAll - 显示全选
virtual - 虚拟列表
Item
Props
| Prop Name | Type | Required | Default | Description |
|---|---|---|---|---|
| itemKey | Key | '' | item的唯一键，不传使用 key 作为键值 | |
| disabled | boolean | 是否禁用 | ||
| tooltip | ReactNode | any | tooltip 提示，可以为文本或 node，也可以是 tooltip 的 props object |
说明
这是菜单项组件
演示
disabled - 是否禁用
tooltip - 提示
SubMenu
Props
| Prop Name | Type | Required | Default | Description |
|---|---|---|---|---|
| title | ReactNode | required | 标题内容 | |
| styleType | 'collapse' | 'popover' | 'collapse' | 为弹出菜单、或是折叠层 | |
| subMenuKey | Key | 子菜单的唯一 key，也用作 collapse 的 panel 的 key，不存在时使用 key 代替 | ||
| disabled | boolean | 禁用 |
说明
这是子菜单组组件