组件关系
可独立绑定布尔状态，也可放入 多选组 管理集合。直接传 options 时使用 多选集合。
使用场景
通过 value 定义单项身份，default 插槽定义显示内容；放入对应 Group 统一维护选择。 与自动消费 options 的 Checkbox 集合入口分开。
组合与双向绑定
单项使用 value；label 用于显示或可访问说明，不依赖旧 label 充当选择值。禁用项无法更改。
组合与双向绑定
vue
<template>
<div class="example">
<AsamCheckboxGroup v-model="value">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
<output>选择：{{ value }}</output>
</div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'AsamCheckboxItemBasicExample' });
import { ref } from 'vue';
import { AsamCheckboxGroup, AsamCheckboxItem } from '@asam-ui/ui';
const value = ref<string[]>(['design']);
</script>
<style scoped>
.example {
display: grid;
gap: var(--asam-space-md, 16px);
min-width: 0;
}
.row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-sm, 8px);
}
.density-grid {
display: grid;
gap: var(--asam-space-md, 16px);
grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}
section {
display: grid;
gap: var(--asam-space-sm, 8px);
min-width: 0;
}
output {
overflow-wrap: anywhere;
color: var(--asam-color-text-secondary);
}
</style>vue
<template>
<div class="example">
<AsamCheckboxGroup v-model="value">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
<output>选择：{{ value }}</output>
</div>
</template>
<script setup>
defineOptions({ name: 'AsamCheckboxItemBasicExample' });
import { ref } from 'vue';
import { AsamCheckboxGroup, AsamCheckboxItem } from '@asam-ui/ui';
const value = ref(['design']);
</script>
<style scoped>
.example {
display: grid;
gap: var(--asam-space-md, 16px);
min-width: 0;
}
.row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-sm, 8px);
}
.density-grid {
display: grid;
gap: var(--asam-space-md, 16px);
grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}
section {
display: grid;
gap: var(--asam-space-sm, 8px);
min-width: 0;
}
output {
overflow-wrap: anywhere;
color: var(--asam-color-text-secondary);
}
</style>选择限制与独立状态
选择限制与独立状态
vue
<template>
<div class="example">
<AsamCheckboxGroup v-model="value" :min="1" :max="2">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="ops"> 运维 </AsamCheckboxItem>
</AsamCheckboxGroup>
<AsamCheckboxItem v-model="checked" :indeterminate="!checked">
独立勾选项
</AsamCheckboxItem>
<output>集合：{{ value }}；独立：{{ checked }}</output>
</div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'AsamCheckboxItemStatesExample' });
import { ref } from 'vue';
import { AsamCheckboxGroup, AsamCheckboxItem } from '@asam-ui/ui';
const value = ref<string[]>(['design']);
const checked = ref(false);
</script>
<style scoped>
.example {
display: grid;
gap: var(--asam-space-md, 16px);
min-width: 0;
}
.row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-sm, 8px);
}
.density-grid {
display: grid;
gap: var(--asam-space-md, 16px);
grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}
section {
display: grid;
gap: var(--asam-space-sm, 8px);
min-width: 0;
}
output {
overflow-wrap: anywhere;
color: var(--asam-color-text-secondary);
}
</style>vue
<template>
<div class="example">
<AsamCheckboxGroup v-model="value" :min="1" :max="2">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="ops"> 运维 </AsamCheckboxItem>
</AsamCheckboxGroup>
<AsamCheckboxItem v-model="checked" :indeterminate="!checked">
独立勾选项
</AsamCheckboxItem>
<output>集合：{{ value }}；独立：{{ checked }}</output>
</div>
</template>
<script setup>
defineOptions({ name: 'AsamCheckboxItemStatesExample' });
import { ref } from 'vue';
import { AsamCheckboxGroup, AsamCheckboxItem } from '@asam-ui/ui';
const value = ref(['design']);
const checked = ref(false);
</script>
<style scoped>
.example {
display: grid;
gap: var(--asam-space-md, 16px);
min-width: 0;
}
.row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-sm, 8px);
}
.density-grid {
display: grid;
gap: var(--asam-space-md, 16px);
grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}
section {
display: grid;
gap: var(--asam-space-sm, 8px);
min-width: 0;
}
output {
overflow-wrap: anywhere;
color: var(--asam-color-text-secondary);
}
</style>四档尺寸与上下文继承
四个实例分别显式使用 large、big、default、small。下面省略 size 的实例随 ConfigProvider 响应切换；显式 size 覆盖祖先。面板本身没有 size 契约的入口不附加虚构尺寸属性。
四档尺寸与上下文继承
vue
<template>
<div class="example">
<div class="density-grid">
<section data-density="large">
<strong> large </strong>
<AsamCheckboxGroup v-model="value" size="large">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
</section>
<section data-density="big">
<strong> big </strong>
<AsamCheckboxGroup v-model="value" size="big">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
</section>
<section data-density="default">
<strong> default </strong>
<AsamCheckboxGroup v-model="value" size="default">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
</section>
<section data-density="small">
<strong> small </strong>
<AsamCheckboxGroup v-model="value" size="small">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
</section>
</div>
<AsamConfigProvider :size="density">
<section data-density="inherited">
<AsamCheckboxGroup v-model="value">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
</section>
</AsamConfigProvider>
<div class="row">
<AsamButton type="default" @click="density = 'small'"> 继承 small </AsamButton>
<AsamButton type="default" @click="density = 'big'"> 继承 big </AsamButton>
</div>
<output>配置提供器：{{ density }}</output>
</div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'AsamCheckboxItemSizesExample' });
import { ref } from 'vue';
import { AsamCheckboxGroup, AsamCheckboxItem, AsamConfigProvider, AsamButton } from '@asam-ui/ui';
import type { AsamControlSize } from '@asam-ui/ui';
const density = ref<AsamControlSize>('big');
const value = ref<string[]>(['design']);
</script>
<style scoped>
.example {
display: grid;
gap: var(--asam-space-md, 16px);
min-width: 0;
}
.row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-sm, 8px);
}
.density-grid {
display: grid;
gap: var(--asam-space-md, 16px);
grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}
section {
display: grid;
gap: var(--asam-space-sm, 8px);
min-width: 0;
}
output {
overflow-wrap: anywhere;
color: var(--asam-color-text-secondary);
}
</style>vue
<template>
<div class="example">
<div class="density-grid">
<section data-density="large">
<strong> large </strong>
<AsamCheckboxGroup v-model="value" size="large">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
</section>
<section data-density="big">
<strong> big </strong>
<AsamCheckboxGroup v-model="value" size="big">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
</section>
<section data-density="default">
<strong> default </strong>
<AsamCheckboxGroup v-model="value" size="default">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
</section>
<section data-density="small">
<strong> small </strong>
<AsamCheckboxGroup v-model="value" size="small">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
</section>
</div>
<AsamConfigProvider :size="density">
<section data-density="inherited">
<AsamCheckboxGroup v-model="value">
<AsamCheckboxItem value="design"> 设计 </AsamCheckboxItem>
<AsamCheckboxItem value="dev"> 开发 </AsamCheckboxItem>
<AsamCheckboxItem value="off" disabled> 停用 </AsamCheckboxItem>
</AsamCheckboxGroup>
</section>
</AsamConfigProvider>
<div class="row">
<AsamButton type="default" @click="density = 'small'"> 继承 small </AsamButton>
<AsamButton type="default" @click="density = 'big'"> 继承 big </AsamButton>
</div>
<output>配置提供器：{{ density }}</output>
</div>
</template>
<script setup>
defineOptions({ name: 'AsamCheckboxItemSizesExample' });
import { ref } from 'vue';
import { AsamCheckboxGroup, AsamCheckboxItem, AsamConfigProvider, AsamButton } from '@asam-ui/ui';
const density = ref('big');
const value = ref(['design']);
</script>
<style scoped>
.example {
display: grid;
gap: var(--asam-space-md, 16px);
min-width: 0;
}
.row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-sm, 8px);
}
.density-grid {
display: grid;
gap: var(--asam-space-md, 16px);
grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}
section {
display: grid;
gap: var(--asam-space-sm, 8px);
min-width: 0;
}
output {
overflow-wrap: anywhere;
color: var(--asam-color-text-secondary);
}
</style>ASAM 扩展与迁移
ASAM 扩展为四档 size 和组内上下文继承。default 插槽只负责展示。Item、Button、Group 不提供实例方法，不能调用集合或输入组件的 focus。事件及当前可用属性以下方实际公开类型为准。
全选与半选
indeterminate 只表达部分选中状态，不替代模型。 完整说明。
全选、半选、边框与扩展值
vue
<template>
<div class="example">
<AsamCheckboxItem
:model-value="all"
:indeterminate="indeterminate"
border
@change="toggleAll"
>全选</AsamCheckboxItem
>
<AsamCheckboxGroup v-model="selected" aria-label="团队集合">
<AsamCheckboxItem v-for="item in options" :key="item" :value="item" border>{{
item
}}</AsamCheckboxItem>
</AsamCheckboxGroup>
<AsamCheckboxItem
v-model="state"
true-value="enabled"
false-value="disabled"
name="independent-state"
>字符串状态</AsamCheckboxItem
>
<output>团队：{{ selected }}；独立值：{{ state }}；半选：{{ indeterminate }}</output>
</div>
</template>
<script lang="ts" setup>
import { computed, ref } from 'vue';
import { AsamCheckboxItem, AsamCheckboxGroup } from '@asam-ui/ui';
const options = ['设计', '开发', '运维'];
const selected = ref<string[]>(['设计']);
const state = ref('disabled');
const all = computed(() => selected.value.length === options.length);
const indeterminate = computed(
() => selected.value.length > 0 && selected.value.length < options.length
);
const toggleAll = (value: string | number | boolean) => {
selected.value = value === true ? [...options] : [];
};
defineOptions({ name: 'AsamCheckboxItemCheckAllDemo' });
</script>
<style scoped>
.example {
display: grid;
gap: var(--asam-space-md, 16px);
}
</style>vue
<template>
<div class="example">
<AsamCheckboxItem
:model-value="all"
:indeterminate="indeterminate"
border
@change="toggleAll"
>全选</AsamCheckboxItem
>
<AsamCheckboxGroup v-model="selected" aria-label="团队集合">
<AsamCheckboxItem v-for="item in options" :key="item" :value="item" border>{{
item
}}</AsamCheckboxItem>
</AsamCheckboxGroup>
<AsamCheckboxItem
v-model="state"
true-value="enabled"
false-value="disabled"
name="independent-state"
>字符串状态</AsamCheckboxItem
>
<output>团队：{{ selected }}；独立值：{{ state }}；半选：{{ indeterminate }}</output>
</div>
</template>
<script setup>
import { computed, ref } from 'vue';
import { AsamCheckboxItem, AsamCheckboxGroup } from '@asam-ui/ui';
const options = ['设计', '开发', '运维'];
const selected = ref(['设计']);
const state = ref('disabled');
const all = computed(() => selected.value.length === options.length);
const indeterminate = computed(
() => selected.value.length > 0 && selected.value.length < options.length
);
const toggleAll = (value) => {
selected.value = value === true ? [...options] : [];
};
defineOptions({ name: 'AsamCheckboxItemCheckAllDemo' });
</script>
<style scoped>
.example {
display: grid;
gap: var(--asam-space-md, 16px);
}
</style>API 阅读方式
旧 controls 已移除，受控区域 ID 改用 ariaControls（模板中写 aria-controls）。trueLabel/falseLabel 在固定 2.14.7 中仍兼容但已弃用；新代码使用 trueValue/falseValue，并显式传入选项的 value，避免以 label 兼作值。
下方 Props、Events、Slots、Exposes 按当前实际公开类型与运行默认值生成。组合属性按分支生效，不能任意混搭值模式。标为“未知 / 未声明”的默认值不代表 false 或空值。源码区域提供对应语言的独立 Demo.vue，可直接复制或下载；本地辅助组件、数据和素材已内联到当前文件。
基础公开委托
透传基础控件的公开能力，保留 ASAM 四档尺寸与品牌样式。 完整说明。
API
属性 AsamCheckboxItemProps
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
ariaLabel | 原生 aria-label属性 | string | undefined | — |
id | 输入控件标识。 | string | undefined | undefined |
disabled | 是否禁用 | boolean | undefined | undefined |
tabindex | 输入框的 tabindex | string | number | undefined | — |
border | 是否显示边框 | boolean | undefined | false |
name | 原生 name 属性 | string | undefined | undefined |
value | 选中状态的值，只有在绑定对象类型为 array 时有效。 | string | number | boolean | Record<string, any> | undefined | undefined |
modelValue | 选中项绑定值 | string | number | boolean | undefined | undefined |
label | 在 checkbox-group 中使用时的复选框标签。 | string | number | boolean | Record<string, any> | undefined | undefined |
checked | 当前是否勾选 | boolean | undefined | false |
indeterminate | 设置不确定状态，仅负责样式控制 | boolean | undefined | false |
validateEvent | 是否触发表单验证 | boolean | undefined | true |
ariaControls | 对应原生 aria-controls，在 indeterminate 为 true 时生效。 | string | undefined | — |
trueValue | 选中时的值 | string | number | undefined | undefined |
falseValue | 没有选中时的值 | string | number | undefined | undefined |
trueLabel | 选中时的值 | string | number | undefined | undefined |
falseLabel | 没有选中时的值 | string | number | undefined | undefined |
size | — | enum"large" | "big" | "default" | "small"完整类型：AsamControlSize | undefined | undefined |
事件 AsamCheckboxItemEmits
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
update:modelValue | — | (AsamCheckboxItemEmits)["update:modelValue"] | — |
change | — | (AsamCheckboxItemEmits)["change"] | — |
插槽 AsamCheckboxItemSlots
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
default | — | (() => unknown) | undefined | — |
实例方法与状态 AsamCheckboxItemExpose
用法与契约补充说明
全选与半选
indeterminate 只表达部分选中状态，不替代模型。全选项通过 change 更新组的数组， 组中单项的 value 决定数组值；独立单项可以使用 trueValue / falseValue 保存字符串、 数字或布尔状态。border、name、tabindex 和 aria-controls 保留原生表单及键盘语义。 复选组的 options 字段别名与按钮自动渲染见本站 CheckboxGroup。
基础公开委托
本入口直接委托底层依赖 2.14.7 对应组件的公开能力；公开 props/defaults、全部事件实参与插槽保持原生行为，仅增加 ASAM 四档尺寸与品牌样式。需要规范化 options、对象或字符串存储时使用本站 AsamRadio / AsamCheckbox 聚合入口。组内 Button 由原生样式处理首中尾连接、选中、禁用、焦点与键盘。
关联组件
参数与事件补充说明
完整透传 2.14.7 的基础参数，并在适用时使用 ASAM 尺寸密度。
参数与事件说明
ariaLabel
必填：否；声明来源：上游声明。
默认值与来源
未知 / 未声明固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
id
必填：否；声明来源：上游声明。
默认值与来源
undefined（已安装运行时；已安装组件）固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）
disabled
必填：否；声明来源：上游声明。
disabled 参数与事件数据
下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举：false / true
默认值与来源
undefined（已安装运行时；已安装组件）固定上游文档默认：false（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）
tabindex
必填：否；声明来源：上游声明。
默认值与来源
未知 / 未声明固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
border
必填：否；声明来源：上游声明。
border 参数与事件数据
下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举：false / true
默认值与来源
false（隐式 Boolean 默认；已安装组件）固定上游文档默认：false（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
name
必填：否；声明来源：上游声明。
默认值与来源
undefined（已安装运行时；已安装组件）固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）
value
必填：否；声明来源：上游声明。
value 参数与事件数据
下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举：false / true
默认值与来源
undefined（已安装运行时；已安装组件）固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）
modelValue
必填：否；声明来源：上游声明。
modelValue 参数与事件数据
下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举：false / true
默认值与来源
undefined（已安装运行时；已安装组件）固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）
label
必填：否；声明来源：上游声明。
label 参数与事件数据
下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举：false / true
默认值与来源
undefined（已安装运行时；已安装组件）固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）
checked
必填：否；声明来源：上游声明。
checked 参数与事件数据
下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举：false / true
默认值与来源
false（隐式 Boolean 默认；已安装组件）固定上游文档默认：false（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
indeterminate
必填：否；声明来源：上游声明。
indeterminate 参数与事件数据
下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举：false / true
默认值与来源
false（隐式 Boolean 默认；已安装组件）固定上游文档默认：false（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
validateEvent
必填：否；声明来源：上游声明。
validateEvent 参数与事件数据
下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举：false / true
默认值与来源
true（已安装运行时；已安装组件）固定上游文档默认：true（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）
ariaControls
必填：否；声明来源：上游声明。
默认值与来源
未知 / 未声明固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
trueValue
必填：否；声明来源：上游声明。
默认值与来源
undefined（已安装运行时；已安装组件）固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）
falseValue
必填：否；声明来源：上游声明。
默认值与来源
undefined（已安装运行时；已安装组件）固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）
trueLabel
必填：否；声明来源：上游声明。
默认值与来源
undefined（已安装运行时；已安装组件）固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）
falseLabel
必填：否；声明来源：上游声明。
默认值与来源
undefined（已安装运行时；已安装组件）固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）
固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）
size
必填：否；声明来源：ASAM 声明。
size 参数与事件数据
下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举："large" / "big" / "default" / "small"
默认值与来源
undefined（源码表达式；ASAM 声明）AsamCheckboxItemProps 公开类型视图
ts
import type { AsamCheckboxItemProps, AsamControlSize } from '@asam-ui/ui';
// AsamCheckboxItemProps
type PublicContract = {
"ariaLabel"?: string | undefined;
"id"?: string | undefined;
"disabled"?: boolean | undefined;
"tabindex"?: string | number | undefined;
"border"?: boolean | undefined;
"name"?: string | undefined;
"value"?: string | number | boolean | Record<string, any> | undefined;
"modelValue"?: string | number | boolean | undefined;
"label"?: string | number | boolean | Record<string, any> | undefined;
"checked"?: boolean | undefined;
"indeterminate"?: boolean | undefined;
"validateEvent"?: boolean | undefined;
"ariaControls"?: string | undefined;
"trueValue"?: string | number | undefined;
"falseValue"?: string | number | undefined;
"trueLabel"?: string | number | undefined;
"falseLabel"?: string | number | undefined;
"size"?: AsamControlSize | undefined;
};参数与事件说明
update:modelValue
必填：是；声明来源：上游声明。
change
必填：是；声明来源：上游声明。
AsamCheckboxItemEmits 公开类型视图
ts
import type { AsamCheckboxItemEmits } from '@asam-ui/ui';
// AsamCheckboxItemEmits
type PublicContract = {
"update:modelValue": (AsamCheckboxItemEmits)["update:modelValue"];
"change": (AsamCheckboxItemEmits)["change"];
};参数与事件说明
default
必填：否；声明来源：ASAM 声明。
default 参数与事件数据
下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数：(): unknown
AsamCheckboxItemSlots 公开类型视图
ts
import type { AsamCheckboxItemSlots } from '@asam-ui/ui';
// AsamCheckboxItemSlots
type PublicContract = {
"default"?: (() => unknown) | undefined;
};AsamCheckboxItemExpose 公开类型视图
ts
import type { AsamCheckboxItemExpose } from '@asam-ui/ui';
// AsamCheckboxItemExpose
type PublicContract = {
[key: string]: never;
};