Skip to content
On this page

Swap 切换

精致的切换组件

基本使用

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

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

开启

不同尺寸

size 属性可配置不同的尺寸

开启

不同动画

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

开启

Attributes

参数说明类型可选值默认值
v-model绑定值boolean——false
size组件尺寸string / number——40
type动画类型SwapTypesound swap——
icon-on打开展示的图标FightingIcon————
icon-off关闭展示的图标FightingIcon————
on-change当绑定值发生改变时触发的回调SwapChange————

Interface

组件导出以下类型定义:

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

SwapType

ts
type SwapType = 'sound' | 'swap'

SwapChange

ts
type SwapChange = (value: boolean, evt: MouseEvent) => void

Contributors