ant-design/components/switch/index.en-US.md
偏右 882cec62d6
docs: 🌈 Add Components overview page (#24491)
* docs: Add components overview page

* fix detail

* remove ContributorsList form overview page

* fix components url

* improve code style

* remove extra file

* fix detail

* fix lint

* fix lint

* docs: Finish components overview page

* fix lint

* docs: Update cover

* fix lint

* update cover

* update menu

* improve overview page

* refactor code

* fix order

* update title

* add components count

* fix overview page ssr bug

* move less file

* update title margin

Co-authored-by: arvinxx <arvinx@foxmail.com>
2020-05-31 11:48:34 +08:00

1.5 KiB

category type title cover
Components Data Entry Switch https://gw.alipayobjects.com/zos/alicdn/zNdJQMhfm/Switch.svg

Switching Selector.

When To Use

  • If you need to represent the switching between two states or on-off state.
  • The difference between Switch and Checkbox is that Switch will trigger a state change directly when you toggle it, while Checkbox is generally used for state marking, which should work in conjunction with submit operation.

API

Property Description Type Default
autoFocus get focus when component mounted boolean false
checked determine whether the Switch is checked boolean false
checkedChildren content to be shown when the state is checked string|ReactNode
defaultChecked to set the initial state boolean false
disabled Disable switch boolean false
loading loading state of switch boolean false
size the size of the Switch, options: default small string default
unCheckedChildren content to be shown when the state is unchecked string|ReactNode
onChange trigger when the checked state is changing Function(checked: boolean, event: Event)
onClick trigger when clicked Function(checked: boolean, event: Event)
className additional class to Switch string

Methods

Name Description
blur() remove focus
focus() get focus