用途:Command 是 shadcn/ui 的命令面板与模糊过滤原语,是对 cmdk 库的样式封装,暴露九个组合部件。它是 Combobox 配方(Popover + Command)、全局 Cmd+K 启动器以及各类模糊过滤界面的基础。
主要能力:cmdk 负责按输入值过滤、按匹配分数排序、键盘导航与 ARIA combobox 角色;shadcn 增加视觉层与 CommandDialog(把同一原语放入 Dialog 并注入 sr-only 标题)。九个部件为 Command(根状态容器,管理 value/onValueChange/shouldFilter/filter/loop)、CommandDialog、CommandInput、CommandList、CommandEmpty、CommandGroup、CommandItem、CommandSeparator、CommandShortcut。
使用方式:内联用法需在 CommandList 内渲染 CommandEmpty,为每个 CommandItem 提供唯一 value,最新 cmdk 的 filter 使用三参数签名 (value, search, keywords) => number。全局启动器用 CommandDialog 配合 useEffect 监听 Cmd+K/Ctrl+K,需 e.preventDefault() 并在清理函数中 removeEventListener。服务端过滤时设 shouldFilter={false},自行管理 items 状态并渲染 CommandLoading(从 cmdk 直接导入)。
适用场景:全局命令面板、表单内 Combobox、表格筛选按钮、侧边栏搜索、仪表盘快捷操作。
限制:command.tsx 必须保留 "use client";CommandDialog 内不要再加可见 DialogTitle;shouldFilter={false} 时必须自行过滤,否则输入框形同虚设;监听器注册与移除必须针对同一目标。