项目正在快速迭代中,API 与视觉细节可能随版本调整,请勿用于生产环境。
仅桌面端保证样式

Checkbox 多选框 ​

可多选的勾选控件:在 eb-checkbox-group 中放置若干 eb-checkbox(或按钮风格的 eb-checkbox-button),绑定值为选中 label 组成的数组;独立使用时支持 boolean / 数组 / true-label 等值语义。在 eb-form 中 change 时机自动触发校验。

基础用法 ​

绑定值为选中 label 组成的数组;单个 checkbox 设置 disabled 只禁用自身(如上例 Svelte),适合个别选项不可勾选的场景。

整组禁用 ​

group 设置 disabled 后整组不可勾选,常用于权限不足、前置条件未满足时的回显展示。

边框与尺寸 ​

border 呈卡片描边样式;size 控制尺寸(large / small),组内可由 group 的 size 统一设置。

按钮风格 ​

eb-checkbox-button 为连体按钮组风格,适合筛选项较多的紧凑布局。

数量限制 ​

group 的 max / min 限制可勾选数量:达到上限后未选项自动禁用,达到下限后已选项禁止取消,用于限选场景(如最多选 2 个标签)。

全选联动 ​

经典全选组合:全选框用 indeterminate 表达半选态(部分选中),change 时全量写入 / 清空数组;子项 change 里根据选中数量同步全选态。indeterminate 只影响样式,不写入绑定值。

handleCheckAll / handleCityChange 定义见页面顶部 script:全选时写入 [...cities],取消时清空数组,子项变化后按数量回写 checkAll。

API ​

CheckboxGroup Props

参数说明类型默认值
v-model绑定值(选中项 label 组成的数组),组内所有子项共享array[]
min / max可勾选数量下限 / 上限(到限后相应选项自动禁用)number—
size组内尺寸,支持 large / smallstring
disabled禁用整组booleanfalse
fill激活态填充色(border / 按钮模式)string—
text-color激活态文字颜色string—

Checkbox Props

参数说明类型默认值
v-model独立使用时的绑定值(boolean / 数组 / true-label 值;group 内由 group 接管)boolean | array | string | number—
label选项值(group 内必填);无插槽内容时兼作显示文案string | number | boolean—
indeterminate半选态(只影响样式,不改变实际选中值),常用于全选控制booleanfalse
true-label / false-label选中 / 未选中时写入绑定值的替代值string | number—
checkedmodelValue 缺省时的初始选中态boolean—
disabled禁用(叠加 group disabled 与数量限制判定)booleanfalse
border卡片描边样式booleanfalse
size尺寸(优先级低于 group)string
name原生 name 属性string—

CheckboxButton Props

参数说明类型默认值
v-model独立使用时的绑定值boolean | array—
label选项值;无插槽内容时兼作显示文案string | number | boolean—
checkedmodelValue 缺省时的初始选中态boolean—
disabled禁用(叠加 group disabled)booleanfalse
size尺寸(优先级低于 group)string
name原生 name 属性string—

Events

参数说明类型默认值
update:modelValue / change勾选变化,group 返回数组,独立使用返回 boolean / 数组 / 标签值(value: any) => void—

Slots

参数说明类型默认值
defaultCheckbox / CheckboxButton 的显示文案,缺省显示 label——

Methods

参数说明类型默认值
focus使内部原生 input 聚焦(Checkbox、CheckboxButton)() => void—
blur使内部原生 input 失焦(Checkbox、CheckboxButton)() => void—