引入
import { SwitchButton } from 'genie-ui'
1、 基本使用
<switch-button :value="value" @change="Change"></switch-button>
2、 自定义切换值
<switch-button :value="value" @change="Change" activeValue="On" inactiveValue="Off"></switch-button>
此时,value=“On” 时,开关打开
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
disabled | 是否禁用 | boolean | —— | false |
value | 绑定值 | boolean/number/string | —— | false |
activeValue | 选中的值 | boolean/number/string | —— | true |
inactiveValue | 未选中的值 | boolean/number/string | —— | false |
activeColor | 选中的颜色 | string | —— | #0082FF |
inactiveColor | 未选中的颜色 | string | —— | #DCDDE2 |
事件名称 | 说明 | 回调参数 |
---|---|---|
change | 值发生改变时,触发该事件 | (value) |
input | 值发生改变时,触发该事件 | (value) |