Radio 单选框
在一组备选项中进行单选。
警告
将 `label` 作为 `value` 使用的方式已被 **废弃**,`label` 仅作为显示文本使用,此用法 **将在** 3.0.0 版本中被移除,请考虑切换到新的 API。
提示
新 API `value` 已在 2.6.0 版本中添加,文档中的示例都使用 `value`。如果您使用的版本 **低于** 2.6.0,请参考
vue
<template>
<el-radio-group v-model="radio1">
<!-- works when >=2.6.0, recommended ✔️ not work when <2.6.0 ❌ -->
<el-radio value="Value 1">Option 1</el-radio>
<!-- works when <2.6.0, deprecated act as value when >=3.0.0 -->
<el-radio label="Label 2 & Value 2">Option 2</el-radio>
</el-radio-group>
</template>基础用法
Radio 的选项不应过多。 如果您有很多选项,请改用 Select 选择器。
禁用状态
使用 `disabled` 属性来禁用单选框。
单选框组
适用于在多个互斥的选项中选择的场景。
带有边框
Options 属性 2.11.2
按钮样式
带有按钮样式的单选组合。
Radio API
Radio 属性
| 名称 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| model-value / v-model | 绑定值 | string / number / boolean | — |
| value 2.6.0 | 单选框的值 | string / number / boolean | — |
| label | 单选框的标签。如果没有 `value`,`label` 将作为 `value` | string / number / boolean | — |
| disabled | 是否禁用单选框 | boolean | false |
| 边框 | 是否显示边框 | boolean | false |
| size | 单选框的尺寸 | 枚举 | — |
| 名称 | 原生 `name` 属性 | string | — |
Radio 事件
| 名称 | 描述 | 类型 |
|---|---|---|
| change | 绑定值改变时触发 | Function |
Radio 插槽
| 名称 | 描述 |
|---|---|
| default | 自定义默认内容 |
RadioGroup API
RadioGroup 属性
| 名称 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| model-value / v-model | 绑定值 | string / number / boolean | — |
| size | 单选框组尺寸,仅对按钮形式的 Radio 或带有边框的 Radio 有效 | string | default |
| disabled | 是否禁用单选框组 | boolean | false |
| validate-event | 是否触发表单验证 | boolean | true |
| text-color | 按钮形式的 Radio 激活时的文本颜色 | string | #ffffff |
| 填充色 | 按钮形式的 Radio 激活时的边框和背景颜色 | string | #409eff |
| aria-label a11y 2.7.2 | 原生 `aria-label` 属性 | string | — |
| 名称 | 原生 `name` 属性 | string | — |
| id | 原生 id 属性 | string | — |
| label a11y 已废弃 | 原生 `aria-label` 属性 | string | — |
| options 2.11.2 | 选项数据,其中 `value` 和 `label` 和 `disabled` 的键名可以通过 `props` 自定义 | array | — |
| props 2.11.2 | 配置选项 | object | {value: 'value', label: 'label', disabled: 'disabled'} |
| type 2.11.5 | 渲染选项的组件类型 (例如:`'button'`) | 枚举 | 'radio' |
RadioGroup 事件
| 名称 | 描述 | 类型 |
|---|---|---|
| change | 绑定值改变时触发 | Function |
RadioGroup 插槽
| 名称 | 描述 | 子标签 |
|---|---|---|
| default | 自定义默认内容 | 单选框 / 按钮样式的单选组合 |
RadioButton API
RadioButton 属性
| 名称 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| value 2.6.0 | 单选框的值 | string / number / boolean | — |
| label | 单选框的标签。如果没有 `value`,`label` 将作为 `value` | string / number / boolean | — |
| disabled | 是否禁用单选框 | boolean | false |
| 名称 | 原生 'name' 属性 | string | — |
RadioButton 插槽
| 名称 | 描述 |
|---|---|
| default | 自定义默认内容 |