b-checkbox · bilibili小程序

多选项目。

属性	类型	默认值	说明
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: {
    checkboxSelected(data){
      console.log(data)
    }
  }
}
</script>

<style lang="less">
.icon-circle:before {
    content: "\e900";
}
</style>