CommandPalette 命令面板
⌘K 全局命令搜索,分组列表 + 命中字符高亮 + 键盘导航。
基础用法
items 中每项可带 group 自动分组、shortcut 右侧提示。键入字符在 label / description / keywords 上做模糊匹配,命中字符以 accent 色加粗高亮。
<CfCommandPalette
:open="open"
:items="items"
@update:open="(v) => open = v"
@select="(id) => onPick(id)"
/> <CfCommandPalette
open={open}
onOpenChange={setOpen}
items={items}
onSelect={(id) => onPick(id)}
/> 隐藏底部提示
hide-footer 隐藏底部”↑↓ 导航 · ↵ 选择 · Esc 关闭”提示,节省竖向空间。
<CfCommandPalette ... hide-footer /> <CfCommandPalette ... hideFooter /> API
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
open / v-model:open | boolean | — | |
items | CommandPaletteItem[] | — | { id, label, description?, group?, shortcut?, keywords?, disabled? } |
placeholder | string | '搜索命令、请求、设置…' | |
emptyText | string | '无匹配结果' | |
closeOnSelect | boolean | true | |
hideFooter | boolean | false |
键盘:↑↓ 导航 · ↵ 选中 · Esc 关闭。
反馈与讨论
CommandPalette 命令面板 的讨论