npm package: @rax-ui/radio
Description: --- display: __ComponentName__ family: other ---
Author: xiaobei.xd
Latest version: 1.0.0-beta.62

---
display: __ComponentName__
family: other
---

# Radio

单选框

## API

### Props

#### Radio

| 名称           | 说明                               | 类型    | 默认值 |
| :------------- | :--------------------------------- | :------ | :----- |
| defaultChecked | 初始选中状态（非受控模式）         | bool    |        |
| checked        | 是否选中（受控模式）               | bool    |        |
| disabled       | 是否禁用                           | bool    | false  |
| style          | 单选框的 style                     | object  | {}     |
| value          | 选项值                             | any     |        |
| readOnly       | 只读模式                           | boolean | false  |
| className      | 单选框的 className                 | string  |        |
| children       | Radio 的子元素，一般为右侧说明文案 | any     |        |
| onChange       | Radio 改变回调                     | func    |        |

#### Radio.Group

| 名称         | 说明                                          | 类型                   | 默认值     |
| :----------- | :-------------------------------------------- | :--------------------- | :--------- |
| defaultValue | 初始选中的选项（非受控模式）                  | string                 | -          |
| value        | 指定选中的选项                                | any                    | -          |
| data         | 数据源                                        | RadioProps[]           |            |
| disabled     | 是否禁用                                      | bool                   | false      |
| readOnly     | 只读模式                                      | boolean                | false      |
| direction    | 排布方向 <br/> 可选值：`horiontal`,`vertical` | enum                   | `vertical` |
| style        | Radio Group 的 style                          | object                 | {}         |
| className    | Radio Group 的 className                      | string                 |            |
| onChange     | 改变时回调函数                                | Function(checkedValue) |            |

### CSS API

#### Radio Group

| 名称                       | 说明                          |
| :------------------------- | :---------------------------- |
| radio--group               | Radio Group 样式              |
| radio--group\_\_horizontal | Radio Group 水平布局时样式    |
| radio--group\_\vertical    | Radio Group 垂直布局时样式    |
| radio--group\_\_item       | Radio Group 中单个 Radio 样式 |

#### Radio

| 名称                                | 说明                         |
| :---------------------------------- | :--------------------------- |
| radio\_\_container                  | radio 样式                   |
| radio\_\_circle                     | 外部圆样式                   |
| radio--selected\_\_circle           | 选中时外部圆样式             |
| radio--disabled\_\_circle           | 不可用时外部圆样式           |
| radio--selected--disabled\_\_circle | 不可用且选中时外部圆样式     |
| radio\_\_point                      | 内部点样式                   |
| radio--selected\_\_point            | 选中时内部点样式             |
| radio--disabled\_\_point            | 不可用时内部点样式           |
| radio--selected--disabled\_\_point  | 不可用且选中时内部点样式     |
| radio\_\_text                       | 文案样式                     |
| radio--selected\_\_text             | 文案选中样式                 |
| radio--disabled\_\_text             | 不可用时文案样式             |
| radio--selected--disabled\_\_text   | 不可用且选中选中时，文案样式 |
| radio\_\_group                      | radio 组的样式               |