设计
设计指南
设计原则
样式指南
设计资源
Klein - Figma
Klein Font
官方图标库
开发
开发文档
React
Vue Web
敬请期待
开发资源
GitHub 代码仓库
生态产品
生态产品
Orion Fonts
敬请期待
Orio Market
敬请期待
Klein Pro
敬请期待
Klein Editor
敬请期待

单选框 Radio

单选框、用于在多个备选项中选中单个状态。

  • 和 Select 的区别是,Radio 所有选项默认可见,方便用户在比较中选择,因此选项不宜过多。

组件展示

基本用法

不可用

options配置使用

按钮样式

实色填底

Radio Props

参数说明类型默认值
showType显示类型string-
prefixCls自定义样式前缀string-
className自定义classstring-
defaultChecked初始是否选中boolean-
checked指定当前是否选中boolean-
style自定义样式CSSProperties-
disabled失效状态boolean-
onChange变化时回调函数((e: RadioChangeEvent) => void)-
autoFocus自动获取焦点boolean-

Radio.Button

参数说明类型默认值
prefixCls自定义样式前缀string-
className自定义classstring-
defaultChecked初始是否选中boolean-
checked指定当前是否选中boolean-
style自定义样式CSSProperties-
disabled失效状态boolean-
onChange变化时回调函数((e: RadioChangeEvent) => void)-
autoFocus自动获取焦点boolean-

Radio.Group

参数说明类型默认值
defaultValue选项组默认值any-
value选项组valueany-
namename属性string-
onChange选项组回调((e: RadioChangeEvent) => void)-
optionType选项子项类型"default"-
buttonStyle选项按钮样式"outline"-
size大小,只对按钮样式生效"default"-
direction控制内部radio是纵向还是横向排列"vertical"-
rowProps支持基础组件row的所有属性RowProps-
prefixCls自定义样式前缀string-
className自定义classstring-
options指定可选项(string-
disabled是否整组失效boolean-
style自定义样式CSSProperties-

贡献者