Skip to content

Swap 切换

切换状态的组件

基本用法

需要使用 v-model 绑定一个值。

大小

size 属性可配置不同的尺寸

自定义值

active-valueinactive-value 分别定义选中和未选中的值。

自定义图标

icon-onicon-off 分别控制切换的不同图标。

动画

type 属性可以配置不同的动画类型

API

Attributes

参数说明类型默认值
v-model绑定值booleanfalse
size组件尺寸string / number-
type动画类型SwapType-
icon-on打开展示的图标IconSlotType-
icon-off关闭展示的图标IconSlotType-

Interface

组件导出以下类型定义:

ts
import type { SwapInstance, SwapProps, SwapType } from 'fighting-design'
import type { SwapInstance, SwapProps, SwapType } from 'fighting-design'

Events

事件名称说明类型
change切换后触发(evt: MouseEvent, value: boolean) => void