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

多选框 Checkbox

多选框、单独使用可以表示两种状态之间的切换,和 switch 类似;区别在于切换 switch 会直接触发状态改变,而 checkbox 一般用于状态标记,需要和提交操作配合。

基本用法

不可用

全选状态

组合checkbox

Checkbox Props

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

Checkbox.Group

参数说明类型默认值
nameGroup名称string-
defaultValue默认选中的选项CheckboxValueType[]-
value指定选中的选项CheckboxValueType[]-
onChange变化时回调函数((checkedValue: CheckboxValueType[]) => void)-
direction控制内部checkbox是纵向还是横向排列"vertical"-
prefixCls自定义样式前缀string-
className自定义classstring-
options指定可选项(string[]
disabled是否整组失效boolean-
style自定义样式CSSProperties-

贡献者