Switch 开关

一、概述

定义

用于开启/关闭，亦或是/否的选择。

使用场景

• 表示两种相互对立的状态间的切换，例如开/关、是/否状态

二、基础样式

交互说明

1.默认开启还是关闭，根据业务情况配置，

2.用户对开关进行操作后，即代表该操作生效

基础用法

<style>
  .switch-box {
    text-align: center;
  }
  .se-switch--box {
    margin: 0 20px;
  }
</style>
<div class="switch-box">
  <se-switch :checked="false" :disabled="true" />
  <se-switch :checked="checked" @change="checkedChange" />
  <se-switch :checked="true" :disabled="true" />
  <se-switch :checked="true" />
</div>
<script>
  export default {
    data() {
      return {
        checked: false
      }
    },
    methods: {
      checkedChange(checked) {
        console.log(checked)
      }
    }
  }
</script>

Props

Events