0.4.1 • Published 7 years ago

pzvue-switch v0.4.1

Weekly downloads
1
License
ISC
Repository
github
Last release
7 years ago

vue-switch

install

npm install pzvue-switch

Demo

http://vue.zuoyan.space/#/component/switch

Quick Start

import pzswitch from 'pzvue-switch'

in component

components: {
    pzswitch
}

in template

<h2 class="title">普通</h2>
<pzswitch @change="change">
  <i slot="open">开</i>
  <i slot="close">关</i>
</pzswitch>
<h2 class="title">大小</h2>
<pzswitch @change="change" size="larger" :checked="true">
  <i slot="open">开启</i>
  <i slot="close">关闭</i>
</pzswitch>
<h2 class="title">不可用</h2>
<pzswitch @change="change" size="larger" :disabled="true" :checked="true">
  <i slot="open">开启</i>
  <i slot="close">关闭</i>
</pzswitch>

Attribute

参数说明类型可选值默认值
sizestringlarger
disabled禁用booleantrue, falsefalse
checked是否选中booltrue, falsefalse
changechange事件functionfunction(value, ischecked){}

Event

事件名说明原型
change开关变化时触发,返回当前的状态function(ischecked){}

Slot

名称说明
open自定义显示打开时的内容
close自定义显示关闭时的内容