## Checker
Checker is more flexible selection component, you can alse customize the layout.
### Example
- Basic usage
```html
```
```js
export default {
data() {
return {
checkerValue: [],
options: [
{
value: 1,
text: 'red'
},
{
value: 2,
text: 'yellow'
},
{
value: 3,
text: 'blue'
},
{
value: 4,
text: 'green'
}
]
}
}
}
```
The value of `options` is an array. The default `checkerValue` value is `''`,
If you clicked one option, the `checkerValue` will be set as the value of this option.
- radio
```html
```
```js
export default {
data() {
return {
checkerValue: '',
options: [
{
value: 0,
text: 'AAAAA'
},
{
value: 1,
text: 'BBBBB'
}
]
}
}
}
```
If the `type` is set to `'radio'`, the checker will be a radio type.
The default type is a `'checkbox'`.
- Use slot
You can use slot to implement custom layout.
```html
{{item.text}}
```
```js
export default {
data() {
return {
checkerList: [],
options: [
{
value: 0,
text: 'AAAAA'
},
{
value: 1,
text: 'BBBBB'
}
]
}
}
}
```
- Use min & max prop
You can use `min` and `max` prop but the `type` must set to `'checkbox'`.
`max` set the max number of checked items, `min` set the min number of checked items.
```html
```
```js
export default {
data() {
return {
checkerList: [3],
option: [
{
value: 1,
text: 'red'
},
{
value: 2,
text: 'yellow'
},
{
value: 3,
text: 'blue'
},
{
value: 4,
text: 'green'
}
]
}
}
}
```
### Props configuration
| Attribute | Description | Type | Accepted Values | Default |
| - | - | - | - | - |
| options | a collection of configuration items | Array | - | - |
| type | the type of checker | String | checkbox/radio | checkbox |
| min | the min number | Number | - | 0 |
| max | the max number | Number | - | options length |
* options sub configuration
| Attribute | Description | Type |
| - | - | - |
| value | the value of checker item | String/Number |
| text | the text of checker item | String |
### CubeCheckerItem Props configuration
| Attribute | Description | Type | Accepted Values | Default |
| - | - | - | - | - |
| option | item configuration object | Object | - | - |
* option sub configuration
| Attribute | Description | Type |
| - | - | - |
| value | the value of checker item | String/Number |
| text | the text of checker item | String |