Switch 开关

使用指南

组件介绍

开关选择器。使用场景：需要表示开关状态/两种状态之间的切换时；和 checkbox 的区别是，切换 switch 会直接触发状态改变，而 checkbox 一般用于状态标记，需要和提交操作配合。

引入方式

import { Switch } from "feart";

components:{
  'fe-switch':Switch
}

data() {
  return {
    checked: false,
      checked1: false,
      checked2: false,
      checked3: false,
      checked4: false,
  };
}

代码演示

基础用法

<fe-switch v-model="checked" />

disabled

<fe-switch :disabled="true" v-model="checked" />

自定义颜色

<fe-switch v-model="checked1" activeColor="green" inactiveColor="red" />

自定义大小

<fe-switch v-model="checked3" size="22px" />

传入文字

<fe-switch checkedText="开" uncheckedText="关" />

嵌入组件

<fe-list title="嵌入组件" isLink>
  <fe-switch v-model="checked2" size="22px" slot="right" />
</fe-list>

API

Events