Checkbox 复选框

在一组备选项中进行多选。适用提醒用户勾选场景，突出多选框选项，可以有效增加用户识别度。

引用

import { Checkbox, regist } from "litos-ui";

regist([Checkbox]);

演示

基础用法

使用当只有一个选项时，可以直接 checked 绑定 boolean 值来控制是否选中；使用 slot-label 来重写选项的文字。

禁用状态

使用 disabled 属性来禁用复选框。

多选框组

结合 l-checkbox-group 组件实现单选框组

注意：传递给 l-checkbox-group 的 value 为多选值的每一项 encodeURIComponent 后拼接 &

按钮样式

只需要为 l-checkbox 设置 button 属性，即可将复选框变为按钮样式

中间状态

设置 indeterminate 属性，表示不确定状态，一般用于实现部分选中的状态。

API

Checkbox Attibutes

参数	说明	类型	默认值
value	value	string	-
checked	是否选中	boolean	false
disabled	是否禁用	boolean	false
button	是否为按钮样式	boolean	false
indeterminate	是否为中间状态	boolean	false
name	原生属性	string	-
label	显示的标签	string	-

CheckboxGroup Attributes

参数	说明	类型	默认值
value	多选值,每一项 encodeURIComponent 后拼接 &	string	-

Checkbox Slots

名称	说明
default	标签

Checkbox Events

事件名	说明	回调参数
change	选中改变时触发, e.detail 包含 value、name、checked	(event: CustomEvent)

CheckboxGroup Events

事件名	说明	回调参数
change	选中改变时触发, e.detail 包含 value 为选中的值的列表	(event: CustomEvent)

Checkbox CSS Variables

变量名	说明	默认值
--l	x	#fff