Skip to content

Switch ​

开关运行时:Root 持有 checked,并支持 loading/disabled;Thumb 只消费上下文。

运行时 ​

状态契约由 @varo-ui/headless 提供;渲染 Parts 分别来自 @varo-ui/h5/primitives 与 @varo-ui/weapp/primitives。

演示 ​

安装包@varo-ui/headless

基础用法 ​

通过上方演示面板切换 H5 与 Weapp primitive 预览/代码;每个运行时只渲染当前条目。

Loading ​

loading 与 disabled 都会关闭交互;loading 更适合异步提交中的短暂锁定。

Parts ​

Part作用
SwitchRoot状态与切换
SwitchThumb滑块 part

Props ​

Prop类型默认值描述
checkedboolean | undefinedundefined受控开关态
defaultCheckedbooleanfalse非受控初始态
disabledbooleanfalse禁用
loadingbooleanfalse加载中,不可切换
asstring'button'根节点标签

Events ​

EventPayload描述
update:checkedboolean受控同步
checkedChangeboolean状态变化

无障碍 ​

  • Root 默认 button 语义。
  • loading/disabled 时不可切换。

平台差异

  • 双端共享 checked/loading 契约。
  • 视觉轨道与动画由 UI wrapper 负责。 :::