Skip to main content

Radio

示例

Button type

Radio type

代码

import { RadioChangeEvent } from 'antd'
import Radio from '.'
import { useState } from 'react'

export default function RadioDemo() {
const [value4, setValue4] = useState('Apple')

const optionsWithDisabled = [
{ label: 'Apple', value: 'Apple' },
{ label: 'Pear', value: 'Pear' },
{ label: 'Orange', value: 'Orange', disabled: true },
]

const onChange4 = ({ target: { value } }: RadioChangeEvent) => {
console.log('radio4 checked', value)
setValue4(value)
}

return (
<div className="demo-container">
<h3>Button type</h3>
<div className="demo-row">
<Radio
options={optionsWithDisabled}
onChange={onChange4}
value={value4}
optionType="button"
buttonStyle="outline"
/>

<Radio
options={optionsWithDisabled}
onChange={onChange4}
value={value4}
optionType="button"
buttonStyle="solid"
/>
</div>

<h3>Radio type</h3>
<div className="demo-row">
<Radio
options={optionsWithDisabled}
onChange={onChange4}
value={value4}
buttonStyle="solid"
/>
</div>
</div>
)
}

API