@58fe/p5/src/doc/checkbox.md

pc端vue组件

<script>
	module.exports = {
		methods: {
			checkGroupChanged(val) {
				let len = val.length;
				this.isAllChecked = len === this.checkListAll.length;
				this.inderterminate = len > 0 && len < this.checkListAll.length;
			},
			handleCheckAllChanged(val) {
				this.inderterminate = false;
				this.checkList2 = val ? this.checkListAll: [];
			}
		},
		data() {
			return {
				checkbox1: true,
				checkbox2: true,
				checkbox3: true,
				checkbox4: true,
				checkbox5: false,
				checkList: ['张三', '小淘气'],
				isAllChecked: false, // 初始化的值需要业务方来判断
				checkListAll: ['张三', '小淘气', '王二麻子', '李四'], // 所有数据
				inderterminate: true, // 不完全选中为true 完全选中or完全不选中为false
				checkList2: ['张三', '小淘气']
			};
		}
	}
</script>

## 多选框

### 引入
```javascript
import { checkbox } from '@58fe/p5';
```

### 基本用法
使用`v-model`绑定boolean类型，来控制选中状态
:::demo 按钮

```html
<checkbox v-model="checkbox1">张三</checkbox>
```

:::

### 基本用法

使用`checked`设置是否默认选中
:::demo 按钮

```html
<checkbox v-model="checkbox2">张三</checkbox>
```

:::


### 禁止使用

:::demo 按钮

```html
<checkbox v-model="checkbox3">张三</checkbox>
<checkbox :disabled=true v-model="checkbox4">李四</checkbox>
<checkbox :disabled=true v-model="checkbox5">小淘气</checkbox>
```

:::

### 多选组

通过`checkbox-group`元素把多个多选框归到一组，使用v-model绑定array类型
:::demo 按钮

```html
<checkbox-group v-model="checkList">
	<checkbox  label="张三"></checkbox>
	<checkbox  label="王二麻子"></checkbox>
	<checkbox :disabled=true label="李四"></checkbox>
	<checkbox :disabled=true label="小淘气"></checkbox>
</checkbox-group>
```

:::

### 全选

通过`checkbox-group`元素把多个多选框归到一组，使用v-model绑定array类型
:::demo 按钮

```html
<checkbox v-model="isAllChecked" :inderterminate="inderterminate" @input="handleCheckAllChanged">全选</checkbox>
<checkbox-group v-model="checkList2" @input="checkGroupChanged">
	<checkbox label="张三"></checkbox>
	<checkbox label="王二麻子"></checkbox>
	<checkbox label="李四"></checkbox>
	<checkbox label="小淘气"></checkbox>
</checkbox-group>
```

:::


### 参数

| 参数     | 说明         | 类型        | 可选值       | 默认值  |
| -------- | ------------ | ----------- | ------------ | ------- |
| value/v-model | 默认选中绑定值 | Boolean     | ——           | false   |
| disabled | 禁用点击 | Boolean     | ——           | false   |
| label | 文案 | String     | ——           | ——   |