Radio - Radio button
Effect demonstration
1. Default effect
<Radio
options={[
{ label: 'Apple', value: 'Apple' },
{ label: 'Pear', value: 'Pear' },
{ label: 'Orange', value: 'Orange' },
]}
/>

2. Selected by default
<Radio
options={[
{ label: 'Apple', value: 'Apple' },
{ label: 'Pear', value: 'Pear' },
{ label: 'Orange', value: 'Orange' },
]}
defaultValue={'Pear'}
/>

3. Disable something
<Radio
options={[
{ label: 'Apple', value: 'Apple' },
{ label: 'Pear', value: 'Pear' },
{ label: 'Orange', value: 'Orange' },
]}
disabledValue={['Apple']}
/>

4. RadioList
<RadioList
options={[
{ label: 'Apple', value: 'Apple' },
{ label: 'Pear', value: 'Pear' },
{ label: 'Orange', value: 'Orange' },
]}
/>

API
Radio /RadioList
| Properties | Required | Description | Type | Default Value |
|---|---|---|---|---|
| options | true | Specify options | RadioOption[] | |
| value | false | selected item | ReactText | |
| onChange | false | The callback function triggered by selecting the radio button | (value: ReactText) => void | |
| defaultValue | false | Default selected items | ReactText | |
| size | false | icon size | number | |
| disabledValue | false | Set disabled items | ReactText[] | |
| containerStyle | false | Custom container style | ViewStyle | |
| itemStyle | false | Customize the style of a single radio button | ViewStyle | |
| labelStyle | false | Custom text style | TextStyle | |
| activeOpacity | false | Opacity when not disabled | number | 0.6 |
RadioItem
| Properties | Required | Description | Type | Default Value |
|---|---|---|---|---|
| itemStyle | false | Customize the style of a single radio button | ViewStyle | |
| labelStyle | false | Custom text style | TextStyle | |
| size | false | icon size | number | |
| activeOpacity | false | Opacity when not disabled | number | 0.6 |
| label | true | radio button text | ReactNode | |
| value | true | The value of the radio button | ReactText | |
| status | true | Radio button checked status | 'checked' | 'unchecked' | |
| disabled | true | Radio button disabled state | boolean | |
| mode | false | Radio button mode, list means display in a list | 'list' | 'row' | |
| onChange | false | The callback function triggered by selecting the radio button | (value: ReactText, status: RadioStatus) => void | |
| isLast | false | Whether it is the last one | boolean | false |