vant 表单按钮置灰_Vant Switch 开关

引入import Vue from 'vue';

import { Switch } from 'vant';

Vue.use(Switch);

代码演示

基础用法

通过v-model绑定开关的选中状态，true表示开，false表示关export default {

data() {

return {

checked: true

};

}

};

禁用状态

通过disabled属性来禁用开关，禁用状态下开关不可点击

加载状态

通过loading属性设置开关为加载状态，加载状态下开关不可点击

自定义大小

通过size属性自定义开关的大小

自定义颜色

active-color属性表示打开时的背景色，inactive-color表示关闭时的背景色

异步控制

需要异步控制开关时，可以使用value属性和input事件代替v-model，并在input事件回调函数中手动处理开关状态export default {

data() {

return {

checked: true

};

},

methods: {

onInput(checked) {

Dialog.confirm({

title: '提醒',

message: '是否切换开关？'</