Radio 单选框
在一组备选项中进行单选
基础用法
水平排列
禁用状态
自定义形状
自定义颜色
自定义大小
自定义图标
左侧文本
禁用文本点击
设置 label-disabled 属性后，点击图标以外的内容不会触发单选框切换。
Radio API
Radio Attributes
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| model-value / v-model | 选中项绑定值 | string / number / boolean | — |
| value | 单选框的值 | string / number / boolean | — |
| label | 单选框的 label 如果value没有值， label则作为value使用 | string / number / boolean | — |
| disabled | 是否禁用单选框 | boolean | false |
| border | 是否显示边框 | boolean | false |
| size | 单选框的尺寸 | enum 'large' | 'default' | 'small' | — |
| name | 原始 name 属性 | string | — |
Radio Events
| 事件名 | 说明 | 类型 |
|---|---|---|
| change | 绑定值变化时触发的事件 | Function (value: string | number | boolean) => void |
Radio Slots
| 插槽名 | 说明 |
|---|---|
| default | 自定义默认内容 |
RadioGroup API
RadioGroup Attributes
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| model-value / v-model | 绑定值 | string / number / boolean | — |
| size | 单选框按钮或边框按钮的大小 | string | default |
| disabled | 是否禁用 | boolean | false |
| text-color | 按钮形式的 Radio 激活时的文本颜色 | string | #ffffff |
| label | 与 RadioGroup 中的 aria-label 属性相同 | string | — |
| name | 原生 name 属性 | string | — |
RadioGroup Events
| 事件名 | 说明 | 类型 |
|---|---|---|
| change | 绑定值变化时触发的事件 | Function (value: string | number | boolean) => void |
RadioGroup Slots
| 插槽名 | 说明 | 子标签 |
|---|---|---|
| default | 自定义默认内容 | Radio / RadioButton |
RadioButton API
RadioButton Attributes
| 属性名 | 说明 | 类型 | 默认 |
|---|---|---|---|
| value | 单选框的值 | string / number / boolean | — |
| label | 单选框的 label 如果没有 value， label则作为value使用 | string / number / boolean | — |
| disabled | 是否禁用单选框 | boolean | false |
| name | 原生 name 属性 | string | — |
RadioButton Slots
| 插槽名 | 说明 |
|---|---|
| default | 默认插槽内容 |