0.4.1 • Published 9 years ago
pzvue-switch v0.4.1
vue-switch
install
npm install pzvue-switchDemo
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
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| size | string | larger | ||
| disabled | 禁用 | boolean | true, false | false |
| checked | 是否选中 | bool | true, false | false |
| change | change事件 | function | function(value, ischecked){} |
Event
| 事件名 | 说明 | 原型 |
|---|---|---|
| change | 开关变化时触发,返回当前的状态 | function(ischecked){} |
Slot
| 名称 | 说明 |
|---|---|
| open | 自定义显示打开时的内容 |
| close | 自定义显示关闭时的内容 |
0.4.1
9 years ago