blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues 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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
docs/examples-dist/actionsheet.vue
View File

@ -5,6 +5,8 @@
<zan-actionsheet v-model="show1" :actions="actions1">
</zan-actionsheet>
</example-block><example-block title="带取消按钮的ActionSheet">
<div class="zan-row">
<zan-button @click="show2 = true">弹出带取消按钮的actionsheet</zan-button>
@ -12,6 +14,8 @@
<zan-actionsheet v-model="show2" :actions="actions1" cancel-text="取消">
</zan-actionsheet>
</example-block><example-block title="带标题的ActionSheet">
<div class="zan-row">
<zan-button @click="show3 = true">弹出带标题的actionsheet</zan-button>
@ -53,7 +57,8 @@ export default {
actions1: [
{
name: '微信安全支付',
className: 'actionsheet-wx'
className: 'actionsheet-wx',
callback: this.handleActionClick
},
{
name: '支付宝支付',
@ -71,6 +76,12 @@ export default {
}
]
};
},
methods: {
handleActionClick(item) {
console.log(item);
}
}
}
</script>

2
docs/examples-dist/swipe.vue
View File

@ -9,7 +9,7 @@
</zan-swipe>
</example-block><example-block title="自动轮播">
<zan-swipe :auto-play="true" @pagechange:end="handlePageEnd">
<zan-swipe auto-play="" @pagechange:end="handlePageEnd">
<zan-swipe-item>
<img src="https://img.yzcdn.cn/upload_files/2017/03/14/FmTPs0SeyQaAOSK1rRe1sL8RcwSY.jpeg?imageView2/2/w/980/h/980/q/75/format/webp" alt="">
</zan-swipe-item>

38
docs/examples-dist/switch.vue
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) => {});
}
}
};