表单
Switch
一个立刻生效的设置。
什么时候用它
放在带保存按钮的表单里,开关就是在骗人——那种情况用 Checkbox。
示例
default
说明
一个立即生效的设置。
和 Checkbox 不同,而且这个区别不是外观上的:开关在拨动那一刻生效,勾选框在提交时生效。一个放在带“保存”按钮的表单里的开关,是在对“改动什么时候发生”撒谎。
打开时轨道填满墨色,滑块是带细线的纸白——而不是一个浮在投影上的白色滑块,这套系统没有投影。关闭态是一条填了线色的轨道,所以这个控件在白色页面上仍然读得出是个控件。
属性
同时接受 ComponentProps<typeof SwitchPrimitive.Root> 里的全部属性,它们会直接透传给底层元素,不再逐条列出。
键盘操作
| 按键 | 作用 |
|---|---|
| SpaceEnter | 切换开关,改动立即生效。 |