Skip to Content
JoyUI
JoyUI/

选择框

可配置标签、尺寸与选项列表的下拉选择。

选项通过 SelectItem 的 id / children 配置;size、label、selectedKey 控制外观与受控状态。

地区

安装

npx @joyui/cli add select --yes

或通过 JoyUI MCP / CLI 安装。

尺寸

md(默认)与 sm(表格等紧凑场景)。

地区 md
md
地区 sm
sm

应用场景

数据表格工具栏的多过滤器:地区 + 阶段,选项列表由业务数据驱动。

地区
阶段

API

Select
参数说明类型可选值默认值
label标签。ReactNode——
placeholder未选中文案。string——
size密度。"sm" | "md"sm · mdmd
selectedKey受控选中。Key——
onSelectionChange选中回调。(key) => void——
className合并到根节点的额外类名。string——
SelectItem
字段说明类型必填示例
id选项键。Key是"eu"
children展示内容。ReactNode是Europe
isDisabled禁用项。boolean否false