Checkbox: fix confused document (#2788)

pull/1873/merge
Ge.Yang 2017-02-20 11:39:52 +08:00 committed by baiyaaaaa
parent 55d1a39ebf
commit 4c0ca0fc14
2 changed files with 12 additions and 12 deletions

View File

@ -11,8 +11,8 @@
isValid: 'valid', isValid: 'valid',
checkAll: false, checkAll: false,
cities: cityOptions, cities: cityOptions,
checkedCities: ['上海', '北京'], checkedCities: ['ShangHai', 'BeiJing'],
isIndeterminate: false isIndeterminate: true
}; };
}, },
methods: { methods: {
@ -34,7 +34,7 @@
## Checkbox ## Checkbox
A group of options for multiple choices. A group of options for multiple choices. content in that tag will become the description following the button of the checkbox.
### Basic usage ### Basic usage
@ -87,7 +87,7 @@ Disabled state for checkbox.
It is used for multiple checkboxes which are bound in one group, and indicates whether one option is selected by checking if it is checked. It is used for multiple checkboxes which are bound in one group, and indicates whether one option is selected by checking if it is checked.
:::demo `checkbox-group` element can manage multiple checkboxes in one group by using `v-model` which is bound as an `Array`. `label` can modify the description following the button of the checkbox. It is also the value of the checkbox. `label` corresponds with the element values in the array. It is selected if the specified value exists in the array, and vice versa. :::demo `checkbox-group` element can manage multiple checkboxes in one group by using `v-model` which is bound as an `Array`. in `el-checkbox` element, `label` is the value of the checkbox. While no content in that tag, it's also modify the description following the button of the checkbox. `label` also corresponds with the element values in the array. It is selected if the specified value exists in the array, and vice versa.
```html ```html
<template> <template>
@ -132,9 +132,9 @@ The `indeterminate` property can help you to achieve a 'check all' effect.
data() { data() {
return { return {
checkAll: true, checkAll: true,
checkedCities: [], checkedCities: ['ShangHai', 'BeiJing'],
cities: cityOptions, cities: cityOptions,
isIndeterminate: false isIndeterminate: true
}; };
}, },
methods: { methods: {

View File

@ -12,7 +12,7 @@
checkAll: false, checkAll: false,
cities: cityOptions, cities: cityOptions,
checkedCities: ['上海', '北京'], checkedCities: ['上海', '北京'],
isIndeterminate: false isIndeterminate: true
}; };
}, },
methods: { methods: {
@ -21,7 +21,7 @@
}, },
handleCheckAllChange(event) { handleCheckAllChange(event) {
this.checkedCities = event.target.checked ? cityOptions : []; this.checkedCities = event.target.checked ? cityOptions : [];
this.isIndeterminate = false; this.isIndeterminate = true;
}, },
handleCheckedCitiesChange(value) { handleCheckedCitiesChange(value) {
let checkedCount = value.length; let checkedCount = value.length;
@ -48,7 +48,7 @@
### 基础用法 ### 基础用法
单独使用可以表示两种状态之间的切换 单独使用可以表示两种状态之间的切换,写在标签中的内容为 checkbox 按钮后的介绍。
:::demo 在`el-checkbox`元素中定义`v-model`绑定变量,单一的`checkbox`中,默认绑定变量的值会是`Boolean`,选中为`true`。 :::demo 在`el-checkbox`元素中定义`v-model`绑定变量,单一的`checkbox`中,默认绑定变量的值会是`Boolean`,选中为`true`。
@ -97,7 +97,7 @@
适用于多个勾选框绑定到同一个数组的情景,通过是否勾选来表示这一组选项中选中的项。 适用于多个勾选框绑定到同一个数组的情景,通过是否勾选来表示这一组选项中选中的项。
:::demo `checkbox-group`元素能把多个 checkbox 管理为一组,只需要在 Group 中使用`v-model`绑定`Array`类型的变量即可`label`属性除了改变 checkbox 按钮后的介绍外,同时也是该 checkbox 对应的值,`label`与数组中的元素值相对应,如果存在指定的值则为选中状态,否则为不选中。 :::demo `checkbox-group`元素能把多个 checkbox 管理为一组,只需要在 Group 中使用`v-model`绑定`Array`类型的变量即可`el-checkbox``label`属性是该 checkbox 对应的值,若该标签中无内容,则该属性也充当 checkbox 按钮后的介绍。`label`与数组中的元素值相对应,如果存在指定的值则为选中状态,否则为不选中。
```html ```html
<template> <template>
@ -142,9 +142,9 @@
data() { data() {
return { return {
checkAll: true, checkAll: true,
checkedCities: [], checkedCities: ['上海', '北京'],
cities: cityOptions, cities: cityOptions,
isIndeterminate: false isIndeterminate: true
}; };
}, },
methods: { methods: {