alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

build docs

Browse Source
This commit is contained in:
cookfront
2017-04-01 17:22:02 +08:00
parent b9dd505809
commit 09d9f7503e
3 changed files with 43 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/examples-dist/switch.vue
+30 -8
View File
@@ -1,24 +1,35 @@
<template><section class="demo-switch"><h1 class="demo-title">switch</h1><example-block title="基础用法">
<zan-switch class="some-customized-class" :checked="switchState" @change="updateState"></zan-switch>
<div class="demo-switch__text">{{ this.switchState ? ' ON' : 'OFF' }}</div>
<zan-switch class="some-customized-class" v-model="switchState1"></zan-switch>
<div class="demo-switch__text">{{ switchState1 ? ' ON' : 'OFF' }}</div>
</example-block><example-block title="基础用法">
<zan-switch class="some-customized-class" v-model="switchState2" :on-change="updateState"></zan-switch>
<div class="demo-switch__text">{{ switchState2 ? ' ON' : 'OFF' }}</div>
</example-block><example-block title="">
<zan-switch class="some-customized-class" :checked="true" :disabled="true"></zan-switch>
<zan-switch class="some-customized-class" v-model="switchStateTrue" :disabled="true"></zan-switch>
<div class="demo-switch__text">ON, DISABLED</div>
<zan-switch class="some-customized-class" :checked="false" :disabled="true"></zan-switch>
<zan-switch class="some-customized-class" v-model="switchStateFalse" :disabled="true"></zan-switch>
<div class="demo-switch__text">OFF, DISABLED</div>
</example-block><example-block title="">
<zan-switch class="some-customized-class" :checked="true" :loading="true"></zan-switch>
<zan-switch class="some-customized-class" v-model="switchStateTrue" :loading="true"></zan-switch>
<div class="demo-switch__text">ON, LOADING</div>
<zan-switch class="some-customized-class" :checked="false" :loading="true"></zan-switch>
<zan-switch class="some-customized-class" v-model="switchStateFalse" :loading="true"></zan-switch>
<div class="demo-switch__text">OFF, LOADING</div>
</example-block></section></template>
<style>
@component-namespace demo {
@@ -35,15 +46,26 @@
</style>
<script>
import Vue from "vue";import ExampleBlock from "../components/example-block";Vue.component("example-block", ExampleBlock);
import Dialog from 'packages/dialog';
export default {
data() {
return {
switchState: true
switchState1: true,
switchState2: true,
switchStateTrue: true,
switchStateFalse: false
};
},
methods: {
updateState(newState) {
this.switchState = newState;
const state = newState ? '打开' : '关闭';
Dialog.confirm({
title: '提醒',
message: '是否' + state + '开关？'
}).then((action) => {
this.switchState2 = newState;
}, (error) => {});
}
}
};