# Radio 单选框
在一组备选项中进行单选，由于选项默认可见，不宜过多，若选项过多，建议使用 Select 选择器。
# 基础样式
选项1
选项2
选项3
选项4
选项5
▼显示代码
# 扩展样式
# ① 按钮样式
按钮样式的单选组合。
# 采用对象方式渲染
▼显示代码
# 采用comp的方式渲染
▼显示代码
# ② 小图片样式
小图片样式的单选组合。
▼显示代码
# ③ 大图片样式
大图片样式的单选组合：图片强制拉伸显示
▼显示代码
大图片样式的单选组合：支持图片居中，自定义背景色。
▼显示代码
# ④ 图文列表样式
图文列表样式的单选组合。
▼显示代码
# ⑤ 页签样式
页签样式的单选组合。
▼显示代码
#
# 调用方式
| 调用方式 |
|---|
| var xxx = new CtpUicomRadio(elObj, options); |
# 参数列表：
| 参数 | 说明 | 类型 | 默认值 | ||
|---|---|---|---|---|---|
| elObj | - | - | 被渲染的dom(必填项) | 可传入一个 DOM 对象或字符串； 若传入字符串，则会将其作为参数传入 document.querySelector以获取到对应 DOM 节点 | - |
| options（类型：object）(必填项) | styleType | 按钮样式："button" 小图片样式："smallImg" 大图片样式："bigImg" 图文列表样式："imageText" 页签样式："tabs" （选填项） | string | "button" | |
| name | - | 当前radio编组的name值,用于form提交 | boolean / string / number | - | |
| item（类型：array） 由1-N个object组成 每个object下的内容包含右侧这些内容 | id | 为radio指定一个id，用于dom查找等功能 值必须唯一 （选填） | string | - | |
| label | 文字（选填） | boolean / string / number | - | ||
| value | value值（选填） | boolean / string / number | - | ||
| checked | 是否选中，每组radio组只允许一个为true（选填） | boolean | false | ||
| disabled | 是否禁用（选填） | boolean | false | ||
| className | 支持传入扩展class（选填） | string | - | ||
| style | 支持传入扩展style（选填） | string | - | ||
| clickFun | 自定义事件（选填） | function(以对象方式渲染时) string(以comp方式渲染时) | - | ||
| img | 图片的地址（仅小图片、大图片、图文列表时必填，否则 选填） | string | - | ||
| imgWidth | 图片的宽度（仅大图片时选填） | number | - | ||
| imgHeight | 图片的高度（仅大图片时选填） | number | - | ||
| imgAutoSize | 图片尺寸是否自动（仅大图片时选填） | number | - | ||
| imgBgc | 图片区的背景颜色（仅imgAutoSize为true时有效） | number | - | ||
| text | 文本内容（仅图文列表时必填，否则 选填） | string | - | ||
# 方法列表（以对象方式渲染时可用）
| 方法 | 说明 | 参数 | 参数说明 | 参数类型 |
|---|---|---|---|---|
| checked | 设置某个radio为选中状态 | index | 设置为选中状态的radio的序号(必填项) | number，从0开始 |
| unchecked | 取消某个radio为选中状态 | index | 设置为选中状态的radio的序号(必填项) | number，从0开始 |
| uncheckedAll | 取消所有radio的选中状态 | |||
| enabled | 启用某个radio | index | 设置为选中状态的radio的序号(必填项) | number，从0开始 |
| enabledAll | 启用所有radio | |||
| disabled | 禁用某个radio | index | 设置为选中状态的radio的序号(必填项) | number，从0开始 |
| disabledAll | 禁用所有radio | |||
| destory | 销毁元素 | - | - | - |
以对象方式渲染时的方法调用示例，请点击下方的“显示代码”查看
▼显示代码
# 方法列表（以comp方式渲染时可用）
| 方法 | 说明 | 参数 | 参数说明 | 参数类型 |
|---|---|---|---|---|
| checked | 设置某个radio为选中状态 | elObj, index | elObj:请见页末"elObj"的说明 index:设置为选中状态的checkbox的序号(必填项) | index: number，从0开始 |
| unchecked | 取消某个radio为选中状态 | elObj, index | elObj:请见页末"elObj"的说明 index:设置为选中状态的checkbox的序号(必填项) | index: number，从0开始 |
| uncheckedAll | 取消所有radio的选中状态 | elObj | 请见页末"elObj"的说明 | String或dom对象 |
| enabled | 启用某个radio | elObj, index | elObj:请见页末"elObj"的说明 index:设置为选中状态的checkbox的序号(必填项) | index: number，从0开始 |
| enabledAll | 启用所有radio | elObj | 请见页末"elObj"的说明 | String或dom对象 |
| disabled | 禁用某个radio | elObj, index | elObj:请见页末"elObj"的说明 index:设置为选中状态的checkbox的序号(必填项) | index: number，从0开始 |
| disabledAll | 禁用所有radio | elObj | 请见页末"elObj"的说明 | String或dom对象 |
| destory | 销毁元素 | - | - | - |
以comp方式渲染时的方法调用示例，请点击下方的“显示代码”查看
▼显示代码
# elObj:
被渲染的dom(必填项)
可传入一个 DOM 对象或字符串；
若传入字符串，则会将其作为参数传入 document.querySelector以获取到对应 DOM 节点