# 选择框 CheckList

一组备选项中进行多选或者单选

# 基础用法

基础用法

配置一组数据源,可进行选择操作

<title>基础用法</title>
<describe>配置一组数据源,可进行选择操作</describe>
<template>
    <hc-check-list v-model="checked" :data="data"></hc-check-list>
</template>
<script>
export default {
  data: function() {
    return {
      checked: '1',
      data: [{
        text: '湖北',
        value: '1'
      }, {
        text: '湖南',
        value: '2'
      }, {
        text: '北京',
        value: '3'
      }, {
        text: '上海',
        value: '4'
      }]
    }
  }
}
</script>

# 多选框组

多选框组

适用于多个勾选框绑定到同一个数组的情景,通过是否勾选来表示这一组选项中选中的项。

<title>多选框组</title>
<describe>适用于多个勾选框绑定到同一个数组的情景,通过是否勾选来表示这一组选项中选中的项。</describe>
<template>
    <hc-check-list v-model="checked" :data="data" multiple></hc-check-list>
</template>
<script>
export default {
  data: function() {
    return {
      checked: '1',
      data: [{
        text: '湖北',
        value: '1'
      }, {
        text: '湖南',
        value: '2'
      }, {
        text: '北京',
        value: '3'
      }, {
        text: '上海',
        value: '4'
      }]
    }
  }
}
</script>

# 属性及事件

# CheckList 属性

属性 说明 类型 可选值 默认值
value 当前值,支持v-model方式使用 string -- --
data 备选项数据源 array -- --
multiple 是否多选 boolean -- false
viewable 是否查看状态 boolean -- false

# CheckList事件

事件 说明 参数
change 用户勾选时触发值改变事件 event.value:改变后的值