Switch

开关控件(role="switch")。支持 size,可读 componentConfig.SwitchonChange 传出 boolean,与 Checkbox 同属 Form 的 checked 协议。

文档站 Demo 跟随 Rspress 明暗主题(亮色用 admin,暗色自动切 dark)。

基础用法

<Switch
  aria-label="开启通知"
  onChange={(checked) => console.log(checked)}
/>

实时演示

尚未提交

与 Form 联用

「必须开启」请用 validatorfalserequired 不算空):

<Form.Item
  name="notify"
  label="通知"
  rules={[{ validator: (v) => (v === true ? undefined : '请开启通知') }]}
>
  <Switch aria-label="开启通知" />
</Form.Item>

API

SwitchProps

属性 类型 默认值 说明
checked boolean 受控
defaultChecked boolean 非受控初始
disabled boolean 禁用
size "sm" | "md" | "lg" "md" 可读 componentConfig.Switch.size
id string Form 可注入
onChange (checked: boolean) => void 切换回调
onBlur FocusEventHandler<button> 失焦
aria-label string 无可见标签时必填
aria-invalid / aria-describedby / aria-required 无障碍
className string 追加类名