设计
设计指南
设计原则
样式指南
设计资源
Klein - Figma
Klein Font
官方图标库
开发
开发文档
React
Vue Web
敬请期待
开发资源
GitHub 代码仓库
生态产品
生态产品
Orion Fonts
敬请期待
Orio Market
敬请期待
Klein Pro
敬请期待
Klein Editor
敬请期待
开关 Switch
开关选择器、需要表示开关状态的切换时。
基本用法
三种大小
禁用状态
回调函数
加载状态
Switch Props
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
size | 开关大小 | "large" | medium |
className | 自定义className | string | - |
style | 自定义style | CSSProperties | - |
checked | 指定当前选中状态 | boolean | - |
defaultChecked | 初始状态 | boolean | false |
checkedChildren | 选中时显示的内容 | ReactNode | - |
unCheckedChildren | 未选中时显示的内容 | ReactNode | - |
disabled | 是否禁用 | boolean | false |
loading | 控制加载状态 | boolean | false |
onChange | 变化时的回调事件 | ((checked: boolean, event: MouseEvent) => void) | - |