<script>
export default {
    components: {},
    data() {
        return{
            radio1: 1,
            selectRadio1: function($event) {
              this.radio1 = $event
            }
        }
    }
}
</script>
# Radio 单选框
在一组备选项中进行单选

## 基础用法
由于选项默认可见，不宜过多，若选项过多，建议使用 Select 选择器。
:::demo 使用`f-icon`嵌入图标
````html
<div class="box">
    <efly-radio :value="1" :active="radio1 === 1" @click="selectRadio1($event)">选项1</efly-radio>
    <efly-radio :value="2" :active="radio1 === 2" @click="selectRadio1($event)">选项2</efly-radio>
</div>
<script>
export default {
    components: {},
    data() {
        return{
            radio1: 1,
            selectRadio1: function($event) {
              this.radio1 = $event
            }
        }
    }
}
</script>
````
:::

## 禁用状态
单选框禁用状态。
:::demo 使用`f-icon`嵌入图标
````html
<div class="box">
    <efly-radio :value="1" :active="radio1 === 1" disabled>选项1</efly-radio>
</div>
````
:::


## 参数说明
| 参数      | 说明    | 类型      | 可选值       | 默认值   |
|---------- |-------- |---------- |-------------  |-------- |
| value     | 绑定并事件返回的值   | Any  |     —        |    —     |
| active    | 是否处于被选中状态   | Boolean  |     true / false        |    false     |
| disabled  | 禁用状态   | Boolean  |    true / false   |    false    |
| size       |大小     | String  |    small / mini  |    —     |

## 事件
| 事件名称      | 说明    | 回调参数   
|---------- |-------- |---------- |
| click     | 点击事件   | 传入的value值  |

  
