Switch 开关

开关控件，用于表示两种相互对立的状态间的切换，如开/关、显示/隐藏。

参数

Props

名称	类型	默认值	描述
modelValue	boolean	-	开关状态，true 为开，false 为关
disabled	boolean	false	是否禁用
size	ComponentSize	'medium'	开关大小
type	ComponentType	'default'	开关类型
activeColor	string	-	开关打开时的颜色
inactiveColor	string	-	开关关闭时的颜色
activeText	string	-	开关打开时的文字说明
inactiveText	string	-	开关关闭时的文字说明
activeIcon	string	-	开关打开时的图标
inactiveIcon	string	-	开关关闭时的图标

Slots

名称	描述	参数
activeIcon	开关打开时的自定义图标	-
inactiveIcon	开关关闭时的自定义图标	-

Events

名称	描述	参数
update:modelValue	开关状态变化时触发	(value: boolean) => void
change	开关状态变化时触发	(value: boolean) => void

示例

基础用法

不同尺寸

不同类型

禁用状态

自定义颜色

文字描述

图标

TypeScript

// 基础颜色类型
export type ComponentType =
  | "default"
  | "primary"
  | "secondary"
  | "success"
  | "warning"
  | "error"
  | "info";

// 组件尺寸
export type ComponentSize = "small" | "medium" | "large";