1# Radio 2 3单选框，提供相应的用户交互选择项。 4 5> **说明：** 6> 7> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 8 9 10## 子组件 11 12无 13 14 15## 接口 16 17Radio(options: {value: string, group: string}) 18 19**参数：** 20 21| 参数名 | 参数类型 | 必填 | 参数描述 | 22| ------ | -------- | ---- | ------------------------------------------------------------ | 23| value | string | 是 | 当前单选框的值。 | 24| group | string | 是 | 当前单选框的所属群组名称，相同group的Radio只能有一个被选中。 | 25 26## 属性 27 28| 名称 | 参数类型 | 描述 | 29| ------- | -------- | ---------------------------------------- | 30| checked | boolean | 设置单选框的选中状态。<br/>默认值：false | 31 32 33## 事件 34 35| 名称 | 功能描述 | 36| ------------------------------------------------ | ------------------------------------------------------------ | 37| onChange(callback: (isChecked: boolean) => void) | 单选框选中状态改变时触发回调。<br> - isChecked为true时，代表选中。<br> - isChecked为false时，代表未选中。 | 38 39 40## 示例 41 42```ts 43// xxx.ets 44@Entry 45@Component 46struct RadioExample { 47 build() { 48 Flex({ direction: FlexDirection.Row, justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) { 49 Column() { 50 Text('Radio1') 51 Radio({ value: 'Radio1', group: 'radioGroup' }).checked(true) 52 .height(50) 53 .width(50) 54 .onChange((isChecked: boolean) => { 55 console.log('Radio1 status is ' + isChecked) 56 }) 57 } 58 Column() { 59 Text('Radio2') 60 Radio({ value: 'Radio2', group: 'radioGroup' }).checked(false) 61 .height(50) 62 .width(50) 63 .onChange((isChecked: boolean) => { 64 console.log('Radio2 status is ' + isChecked) 65 }) 66 } 67 Column() { 68 Text('Radio3') 69 Radio({ value: 'Radio3', group: 'radioGroup' }).checked(false) 70 .height(50) 71 .width(50) 72 .onChange((isChecked: boolean) => { 73 console.log('Radio3 status is ' + isChecked) 74 }) 75 } 76 }.padding({ top: 30 }) 77 } 78} 79``` 80 81
