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