mirror of https://github.com/ElemeFE/element
Add examples of min/max props to checkbox group in documentation
parent
3cefe969be
commit
87f9c5f580
|
@ -12,6 +12,7 @@
|
|||
checkAll: false,
|
||||
cities: cityOptions,
|
||||
checkedCities: ['Shanghai', 'Beijing'],
|
||||
checkedCities1: ['Shanghai', 'Beijing'],
|
||||
isIndeterminate: true
|
||||
};
|
||||
},
|
||||
|
@ -153,6 +154,40 @@ The `indeterminate` property can help you to achieve a 'check all' effect.
|
|||
```
|
||||
:::
|
||||
|
||||
|
||||
### Minimum / Maximum items checked
|
||||
|
||||
The `minimum` and `maximum` properties can help you to limit the number of checked items.
|
||||
|
||||
:::demo
|
||||
|
||||
```html
|
||||
<template>
|
||||
<el-checkbox-group
|
||||
v-model="checkedCities1"
|
||||
minimum="1"
|
||||
maximum="2">
|
||||
<el-checkbox v-for="city in cities" :label="city">{{city}}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</template>
|
||||
<script>
|
||||
const cityOptions = ['Shanghai', 'Beijing', 'Guangzhou', 'Shenzhen'];
|
||||
let handlerLimitExceeded = (event) => {
|
||||
currentEvent = event;
|
||||
console.log(event);
|
||||
}
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
checkedCities1: ['Shanghai', 'Beijing'],
|
||||
cities: cityOptions
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
```
|
||||
:::
|
||||
|
||||
### Checkbox Attributes
|
||||
| Attribute | Description | Type | Options | Default|
|
||||
|---------- |-------- |---------- |------------- |-------- |
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
checkAll: false,
|
||||
cities: cityOptions,
|
||||
checkedCities: ['上海', '北京'],
|
||||
checkedCities1: ['上海', '北京'],
|
||||
isIndeterminate: true
|
||||
};
|
||||
},
|
||||
|
@ -163,6 +164,38 @@
|
|||
```
|
||||
:::
|
||||
|
||||
### Minimum / Maximum items checked (to be translated)
|
||||
|
||||
The `minimum` and `maximum` properties can help you to limit the number of checked items.
|
||||
|
||||
:::demo
|
||||
|
||||
```html
|
||||
<template>
|
||||
<el-checkbox-group
|
||||
v-model="checkedCities1"
|
||||
minimum="1"
|
||||
maximum="2">
|
||||
<el-checkbox v-for="city in cities" :label="city">{{city}}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</template>
|
||||
<script>
|
||||
const cityOptions = ['上海', '北京', '广州', '深圳'];
|
||||
let handlerLimitExceeded = (event) => {
|
||||
currentEvent = event;
|
||||
console.log(event);
|
||||
}
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
checkedCities1: ['上海', '北京'],
|
||||
cities: cityOptions
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
```
|
||||
:::
|
||||
### Checkbox Attributes
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|
||||
|---------- |-------- |---------- |------------- |-------- |
|
||||
|
|
Loading…
Reference in New Issue