使用指南

import { CheckboxGroup, Checkbox } from 'border-ui';

Vue.component(CheckboxGroup.name, CheckboxGroup);
Vue.component(Checkbox.name, Checkbox);

TIP

Checkbox组件可以单独使用，也可以组合使用。

单独使用

禁用状态

按钮组

按钮组 + 限制选择数量

搭配Cell使用

有几点需要注意：

Checkbox组件通过slotvalue被正确的插入到CellItem的右侧
每个Checkbox组件需要定义一个ref引用，以便正确的找到每个CellItem对应的Checkbox
Checkbox、Radio组件内部都有toggle方法，绑定组件的click事件，用于触发组件选中状态

export default {
  data () {
    return {
      result1: true,
      result2: ['B'],
      result3: [],
      result4: [],
      check4List: ['A', 'B', 'C']
    }
  },
  methods: {
    toggle (index) {
      this.$refs.checkboxes[index].toggle()
    }
  }
}

API

Checkbox Props

参数	说明	类型	默认
disabled	是否禁用	Boolean	false
iconSize	icon尺寸	String	24px
value	是否选中(等于trueValue选中,等于falseValue未选中)	B/S	false
trueValue	选中状态时的值	String
falseValue	未选中状态的值	String
label	需配合CheckboxGroup使用，表示该Checkbox被选中时的值	String

CheckboxBroup Props

参数	说明	类型	默认值
v-model	被选中的值	Array	[]
max	最多选择几个	Number
disabled	是否禁用	Boolean	false

CheckboxBroup Events

事件名	说明	类型	默认值
change	Checkbox被选中触发，参数为被选中Checkbox的label	Function

# 使用指南

# 单独使用

# 禁用状态

# 按钮组

# 按钮组 + 限制选择数量

# 搭配Cell使用

# API

# Checkbox Props

# CheckboxBroup Props

# CheckboxBroup Events

使用指南

单独使用

禁用状态

按钮组

按钮组 + 限制选择数量

搭配Cell使用

API

Checkbox Props

CheckboxBroup Props

CheckboxBroup Events