element 中switch 开关使用

1、基本用法（默认是Boolean类型）

<template>
<el-switch v-model="value"></el-switch>
</template>

<script>
  export default {
    data() {
      return {
        value: true,
      }
    },
  }
</script>

 二、拓展用法

1、改变背景色

绑定v-model到一个Boolean类型的变量。可以使用active-color属性与inactive-color属性来设置开关的背景色。

2、增加文字描述

使用active-text属性与inactive-text属性来设置开关的文字描述。

3、使用v-model使用其他类型的值

设置active-value和inactive-value属性，接受Boolean, String或Number类型的值，默认为Boolean类型。

<template>
<el-switch
    v-model="value"
    active-color="#13ce66"
    inactive-color="#ff4949"
    active-text="打开"
    inactive-text="关闭"
    active-value="100"
    inactive-value="0">
 </el-switch>
</template>

<script>
  export default {
    data() {
      return {
        value: '100',
      }
    },
  }
</script>