Checkbox 多选框
一组备选项中进行多选
基础用法
html
<ivy-checkbox>苹果</ivy-checkbox>
自定义选中和没有选中的值
通过
true-label
和false-label
来设置选中和没有选中的值,通常适用于单个选择框的情况
html
<ivy-checkbox true-label="1" false-label="0">勾选即同意本协议</ivy-checkbox>
禁用效果
html
<ivy-checkbox disabled>苹果</ivy-checkbox>
配合ivy-checkbox-group
使用
html
<ivy-checkbox-group onchange="console.log(this.value)">
<ivy-checkbox label="1" checked>苹果</ivy-checkbox>
<ivy-checkbox label="2">橘子</ivy-checkbox>
<ivy-checkbox label="3">香蕉</ivy-checkbox>
</ivy-checkbox-group>
Checkbox Props
Prop | 描述 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
label | 选中后的值,在配合 CheckboxGroup 时可用 | string|number|boolean | - | false |
trueLabel | 选中的值 | string | - | - |
falseLabel | 未选中的值 | string | - | - |
disabled | 是否禁用 | boolean | - | false |
checked | 选中 | boolean | - | false |
Checkbox Group Props
Prop | 描述 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
disabled | 是否禁用 | boolean | - | false |
Checkbox Group Event
Event | 描述 |
---|---|
change | 选中值改变时触发 |