多选项目。
属性 | 类型 | 默认值 | 说明 | 版本 |
value | string | | checkbox 标识,选中时触发 checkbox-group 的 change 事件,并携带 checkbox 的 value | |
disabled | boolean | false | 是否禁用 | |
checked | boolean | false | 当前是否选中,可用来设置默认选中 | |
color | string | '#FFFFFF' | checkbox 的颜色,同css的color | |
icon | string | 'icon-select' | 选中时icon的class名,可传入自定义class | |
propsStyle | Object | | 自定义样式 | |
propsStyle 的结构
属性 | 类型 | 说明 | 版本 |
default | Object | 默认样式 | |
selected | Object | 选中时样式 | |
disabled | Object | 禁用时样式 | |
示例代码
<template>
<div>
<b-checkbox-group @change="checkboxSelected">
<b-checkbox
icon="icon-circle"
:propsStyle="{
default: {background: 'red'},
selected: {background: 'green'},
disabled: {}
}"
value="A"
/>A
<b-checkbox value="B"/>B
<b-checkbox value="C"/>C
</b-checkbox-group>
</div>
</template>
<script>
export default {
data() {
return {};
},
methods: {}
};
</script>
<style lang="less">
.icon-circle:before {
content: "\e900";
}
</style>