ant-design/components/radio/index.en-US.md
二货爱吃白萝卜 0e9ac35e3c
Some checks are pending
Publish Any Commit / build (push) Waiting to run
🔀 Sync mirror to Gitee / mirror (push) Waiting to run
✅ test / lint (push) Waiting to run
✅ test / test-react-legacy (16, 1/2) (push) Waiting to run
✅ test / test-react-legacy (16, 2/2) (push) Waiting to run
✅ test / test-react-legacy (17, 1/2) (push) Waiting to run
✅ test / test-react-legacy (17, 2/2) (push) Waiting to run
✅ test / test-node (push) Waiting to run
✅ test / test-react-latest (dom, 1/2) (push) Waiting to run
✅ test / test-react-latest (dom, 2/2) (push) Waiting to run
✅ test / test-react-latest-dist (dist, 1/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist, 2/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist-min, 1/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist-min, 2/2) (push) Blocked by required conditions
✅ test / test-coverage (push) Blocked by required conditions
✅ test / build (push) Waiting to run
✅ test / test lib/es module (es, 1/2) (push) Waiting to run
✅ test / test lib/es module (es, 2/2) (push) Waiting to run
✅ test / test lib/es module (lib, 1/2) (push) Waiting to run
✅ test / test lib/es module (lib, 2/2) (push) Waiting to run
👁️ Visual Regression Persist Start / test image (push) Waiting to run
fix: input work with Upload (#51874)
* fix: input work with Upload

* test: update snapshot
2024-12-03 19:07:28 +08:00

4.0 KiB
Raw Blame History

category group title description cover coverDark demo
Components Data Entry Radio Used to select a single state from multiple options. https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*mrPVRope68wAAAAAAAAAAAAADrJ8AQ/original https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*xPfTSphsiA0AAAAAAAAAAAAADrJ8AQ/original
cols
2

When To Use

  • Used to select a single state from multiple options.
  • The difference from Select is that Radio is visible to the user and can facilitate the comparison of choice, which means there shouldn't be too many of them.

Examples

Basic disabled Radio Group Vertical Radio.Group Block Radio.Group Radio.Group group - optional radio style Radio.Group with name Size Solid radio button Badge style Wireframe Component Token Upload Debug

API

Common props refCommon props

Radio/Radio.Button

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 -

RadioGroup

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) -

CheckboxOptionType

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

Methods

Radio

Name Description
blur() Remove focus
focus() Get focus

Design Token