基本定义
概述
复选框用于多项选择，当用户点击复选框时，它会在选中和未选中之间切换。每个复选框是独立于列表中的其他复选框工作的，因此选中一个复选框后不会影响其他复选框。
复选框通常不会立即应用在当前列表或页面，在更改后用户需要通过触发操作按钮（例如保存、确认）后才会生效。
构成元素
带有组标签的复选框组件是由组标签、复选框输入和一个描述复选框用途的文本组成。 无组标签的复选框组件是由复选框输入和一个描述复选框用途的文本组成。
- 组标签（可选）：传达下面需要选择的内容。
- 复选框输入：指示适当状态的复选框输入。默认情况下它是未选中的
- 复选框标签：描述您要选择或取消选择的信息。
复选框操作有3种类型，一组复选框的默认视图是没有选择任何选项。
- unselected
- selected
- indeterminate
复选框selected类型下有两种状态：
- Default
- 已禁用
复选框unselected类型下有三种状态：
- Default
- 已禁用
- Focus
布局
水平
复选框组默认以水平方式排列，当任意一个Value有备注信息的时候，当前KV的所有V使用垂直布局
跨端展示
复选框在mobile端展示内容有：
- 文本标签
- 已选择后的对勾提示项
规格
复选框的3种Lable尺寸
| S | 小于等于6个字符 | 72px |
|---|---|---|
| M | 6-10个字符 | 宽度120px |
| L | 最多16个字符 | 宽度192px |
用法
什么时候使用
- 复选框枚举项至少大于等于两项, 且默认不会被选中任何选项, 允许不带lable标题直接使用, 横向布局遵循删格化布局。
- 只能选择或取消选择一个选项，且含义很明显时可使用它（单个复选框）
- 有一组可以相互独立选择的选项（复选框组）
什么时候不使用
- 如果用户只能从列表中选择一个选项，则应使用单选按钮而不是复选框。复选框允许用户选择一组中的多个项目，而单选按钮允许用户只选择一个选项。
- 您想为“是/否”或“开/关”类型的决定提供两个选项。考虑改用开关控件。
最佳实践
复选框组件经常用于表单中。表单可以放置在页面、模态或侧面板中。复选框还可用于同意条款和条件或过滤信息。
行为
交互方式
鼠标 用户可以通过直接点击复选框输入或点击复选框标签来触发一个动作。
键盘 用户可以按 Tab 键触发焦点，有焦点时按Space 更改状态。
相关资源
组件负责人
- 前端:杨小英
- 设计:李帆