Dropdown Menu 用于在有限空间中承载单选操作,支持 Filled 与 No padding 两种样式,以及点击展开后的菜单内容展示。
组件支持 Filled 与 No padding 两种外观,并包含 Medium、Large 两种尺寸。
多选触发器展示标签摘要,展开后使用 Checkbox 列表展示已选内容与描述信息。
支持收起时单行摘要展示,展开后在触发器内多行展示已选标签,并在下拉层中继续多选。
支持搜索输入框、触发器当前值展示,以及带图标的搜索结果列表。
禁用状态下保持变量体系一致,并禁止触发下拉交互。
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| appearance | 下拉触发器外观样式 | string | 'filled' | 'no-padding' | 'filled' |
| size | 组件尺寸 | string | 'medium' | 'large' | 'medium' |
| placeholder | 未选择内容时的占位文案 | string | - | 'Placeholder' |
| value | 当前展示文案;为空时使用 placeholder | string | - | '' |
| items | 下拉选项配置数组 | array | - | [] |
| items[].label | 选项标题 | string | - | '' |
| items[].description | 选项描述文案,Filled 展开态可展示 | string | - | '' |
| selectedIndex | 默认选中项索引 | number | - | -1 |
| open | 是否默认展开 | boolean | true | false | false |
| searchable | 是否展示搜索输入区域 | boolean | true | false | false |
| searchPlaceholder | 搜索输入框占位文案 | string | - | '搜索游戏' |
| leadingIcon | 触发器左侧 iconfont HTML | string | - | '' |
| disabled | 是否禁用 | boolean | true | false | false |
| onChange | 选中项变化回调 | function | - | null |
| onOpenChange | 展开状态变化回调 | function | - | null |
| className | 自定义类名 | string | - | '' |
| id | 自定义 id | string | - | '' |