Radio
Radio
Used to select a single state from multiple options.
가져오기import{ Radio }from"antd"; |
- Components Overview
- General
- Layout
- Navigation
- Data Entry
- Data Display
- Feedback
- Other
가져오기import{ Radio }from"antd"; |
Common props ref：Common props
| Property | Description | Type | Default |
|---|---|---|---|
| autoFocus | Whether get focus when component mounted | boolean | false |
| checked | Specifies whether the radio is selected | boolean | false |
| defaultChecked | Specifies the initial state: whether or not the radio is selected | boolean | false |
| disabled | Disable radio | boolean | false |
| value | According to value for comparison, to determine whether the selected | any | - |
Radio group can wrap a group of Radio。
| Property | Description | Type | Default | Version |
|---|---|---|---|---|
| buttonStyle | The style type of radio button | outline | solid | outline | |
| defaultValue | Default selected value | any | - | |
| disabled | Disable all radio buttons | boolean | false | |
| name | The name property of all input[type="radio"] children | string | - | |
| options | Set children optional | string[] | number[] | Array<CheckboxOptionType> | - | |
| optionType | Set Radio optionType | default | button | default | 4.4.0 |
| size | The size of radio button style | large | middle | small | - | |
| value | Used for setting the currently selected value | any | - | |
| block | Option to fit RadioGroup width to its parent width | boolean | false | 5.21.0 |
| onChange | The callback function that is triggered when the state changes | function(e:Event) | - |
| Property | Description | Type | Default | Version |
|---|---|---|---|---|
| label | The text used to display as the Radio option | string | - | 4.4.0 |
| value | The value associated with the Radio option | string | number | boolean | - | 4.4.0 |
| style | The style to apply to the Radio option | React.CSSProperties | - | 4.4.0 |
| disabled | Specifies whether the Radio option is disabled | boolean | false | 4.4.0 |
| title | Adds the Title attribute value | string | - | 4.4.0 |
| id | Adds the Radio Id attribute value | string | - | 4.4.0 |
| onChange | Triggered when the value of the Radio Group changes | (e: CheckboxChangeEvent) => void; | - | 4.4.0 |
| required | Specifies whether the Radio option is required | boolean | false | 4.4.0 |
| Name | Description |
|---|---|
| blur() | Remove focus |
| focus() | Get focus |
| 토큰 이름 | 설명 | 타입 | 기본값 |
|---|---|---|---|
| buttonBg | 单选框按钮背景色 | string | #ffffff |
| buttonCheckedBg | 单选框按钮选中背景色 | string | #ffffff |
| buttonCheckedBgDisabled | 单选框按钮选中并禁用时的背景色 | string | rgba(0, 0, 0, 0.15) |
| buttonCheckedColorDisabled | 单选框按钮选中并禁用时的文本颜色 | string | rgba(0, 0, 0, 0.25) |
| buttonColor | 单选框按钮文本颜色 | string | rgba(0, 0, 0, 0.88) |
| buttonPaddingInline | 单选框按钮横向内间距 | number | 15 |
| buttonSolidCheckedActiveBg | 单选框实色按钮选中时的激活态背景色 | string | #0958d9 |
| buttonSolidCheckedBg | 单选框实色按钮选中时的背景色 | string | #1677ff |
| buttonSolidCheckedColor | 单选框实色按钮选中时的文本颜色 | string | #fff |
| buttonSolidCheckedHoverBg | 单选框实色按钮选中时的悬浮态背景色 | string | #4096ff |
| dotColorDisabled | 单选框圆点禁用颜色 | string | rgba(0, 0, 0, 0.25) |
| dotSize | 单选框圆点大小 | number | 8 |
| radioSize | 单选框大小 | number | 16 |
| wrapperMarginInlineEnd | 单选框右间距 | number | 8 |
