## Radio ### Install ``` javascript import { Radio } from 'vant'; Vue.component(Radio.name, Radio); ``` ### Usage #### Basic Usage Use `v-model` to bind check status of radio. The value will be set to the name of radio when radio get checked. :::demo Basic Usage ```html
Radio 1 Radio 2
``` ```javascript export default { data() { return { radio1: '1' } } }; ``` ::: #### Disabled :::demo Disabled ```html
Disabled Disabled and checked
``` ```javascript export default { data() { return { radio2: '2' } } }; ``` ::: #### RadioGroup When Radios are inside a RadioGroup, the checked radio's name is bound with CheckboxGroup by `v-model`. :::demo RadioGroup ```html
Radio 1 Radio 2
``` ```javascript export default { data() { return { radio3: '1' } } }; ``` ::: #### With Cell :::demo With Cell ```html Radio 1 Radio 2 ``` ```javascript export default { data() { return { radio4: '1' } } }; ``` ::: ### Radio API | Attribute | Description | Type | Default | Accepted Values | |-----------|-----------|-----------|-------------|-------------| | disabled | Diable radio | `Boolean` | `false` | - | | name | Radio name | `Boolean` | `false` | - | ### RadioGroup API | Attribute | Description | Type | Default | Accepted Values | |-----------|-----------|-----------|-------------|-------------| | disabled | Diable all radios | `Boolean` | `false` | - | ### RadioGroup Event | Event | Description | Parameters | |-----------|-----------|-----------| | change | Triggered when value changed | current value |