引入组件

局部引入

// parent.vue
const FSwitch = defineAsyncComponent(() => import('@/components/formaui/f-switch/f-switch.vue'))

基础用法

checked属性：是否选中（默认false）

<f-switch :checked="checked1" @change="val => (checked1 = val)" />

type属性：样式类型（默认switch）

可传入[switch、checkbox]

<f-switch type="checkbox" :checked="checked2" @change="val => (checked2 = val)" />

disabled属性：禁用状态

<f-switch :checked="true" disabled />
<f-switch :checked="false" disabled />

color属性：switch 选中颜色

<f-switch :checked="checked3" @change="val => (checked3 = val)" color="#07C160" />

插槽

名称	说明
-	-

属性

名称	类型	说明	默认值
name	string	开关选择器名称	''
checked	boolean	是否选中	false
disabled	boolean	是否禁用	false
type	string	样式类型，可传入[switch、checkbox]	switch
color	string	switch 选中颜色	-
borderColor	string	type=checkbox 时的边框颜色	#ccc
checkMarkColor	string	type=checkbox 时的对号颜色	#fff
scaleRatio	number|string	缩放比例	1

事件

事件名	说明	回调参数
change	开关改变事件	value: boolean