test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-01 03:29:39 +08:00
Code Issues Actions 69 Packages Projects Releases Wiki Activity
9436ece6e3
ant-design/components/switch/index.zh-CN.md
黑雨 cef58664e8
📝doc: add design token table (#41717) 
* ✨feat: add token

* 📝doc: update lint

* 📝doc: update doc
2023-04-11 10:25:24 +08:00

1.8 KiB
Raw Blame History

category subtitle group title cover coverDark demo
Components 开关 数据录入 Switch https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*rtArRpBNDZcAAAAAAAAAAAAADrJ8AQ/original https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*al07RK8SGf4AAAAAAAAAAAAADrJ8AQ/original
cols
2

开关选择器。

何时使用

  • 需要表示开关状态/两种状态之间的切换时；
  • 和 checkbox 的区别是，切换 switch 会直接触发状态改变，而 checkbox 一般用于状态标记，需要和提交操作配合。

代码演示

基本 不可用 文字和图标 两种大小 加载中

API

参数 说明 类型 默认值
autoFocus 组件自动获取焦点 boolean false
checked 指定当前是否选中 boolean false
checkedChildren 选中时的内容 ReactNode -
className Switch 器类名 string -
defaultChecked 初始是否选中 boolean false
disabled 是否禁用 boolean false
loading 加载中的开关 boolean false
size 开关大小，可选值：default small string default
unCheckedChildren 非选中时的内容 ReactNode -
onChange 变化时的回调函数 function(checked: boolean, event: Event) -
onClick 点击时的回调函数 function(checked: boolean, event: Event) -

方法

名称 描述
blur() 移除焦点
focus() 获取焦点

Design Token