## Switch 开关 ### 使用指南 ``` javascript import { Switch } from 'vant'; Vue.component(Switch.name, Switch); ``` ### 代码演示 #### 基础用法 :::demo 基础用法 ```html
{{ switchState1 ? ' 打开' : '关闭' }}
{{ switchState2 ? ' 打开' : '关闭' }}
``` ::: #### 禁用状态 设置`disabled`属性为`true`,此时开关不可点击。 :::demo 禁用状态 ```html
打开
关闭
``` ::: #### loading状态 设置`loading`属性为`true`,此时开关为加载状态,一般用于点击开关时正在向后端发送请求,此时正在loading,请求成功后,结束loading。 :::demo loading状态 ```html
打开
关闭
``` ::: ### API | 参数 | 说明 | 类型 | 默认值 | 可选值 | |-----------|-----------|-----------|-------------|-------------| | v-model | 开关状态 | `boolean` | `false` | `true`, `false` | | loading | loading状态 | `boolean` | `false` | `true`, `false` | | disabled | 禁用状态 | `boolean` | `false` | `true`, `false` | | onChange | 开关状态切换回调(默认则改变开关状态) | `function` | - | - |