ui/vant
1
0
Fork 0
mirror of https://github.com/youzan/vant.git synced 2025-10-18 17:51:54 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

feat: update switch style

Browse Source
This commit is contained in:
jiangruowei
2017-03-01 11:12:16 +08:00
parent 9a4dc8fb64
commit 456cf908af
4 changed files with 50 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
docs/examples-docs/switch.md
View File

@@ -4,17 +4,29 @@
```html
<div class="page-switch">
<div class="page-switch__wrapper">
<z-switch class="some-customized-class" :checked="switchState" :on-change="updateState"></z-switch>
<div class="page-switch__text">{{switchStateText}}</div>
</div>
<div class="page-switch__wrapper">
<z-switch class="some-customized-class" :checked="true" :disabled="true"></z-switch>
<div class="page-switch__text">ON, DISABLED</div>
</div>
<div class="page-switch__wrapper">
<z-switch class="some-customized-class" :checked="false" :disabled="true"></z-switch>
<div class="page-switch__text">OFF, DISABLED</div>
<h1 class="page-title">Switch</h1>
<h2 class="page-sub-title">基础用法</h2>
<div class="page-switch">
<div class="page-switch__wrapper">
<zan-switch class="some-customized-class" :checked="switchState" :on-change="updateState"></zan-switch>
<div class="page-switch__text">{{switchStateText}}</div>
</div>
<div class="page-switch__wrapper">
<zan-switch class="some-customized-class" :checked="true" :disabled="true"></zan-switch>
<div class="page-switch__text">ON, DISABLED</div>
</div>
<div class="page-switch__wrapper">
<zan-switch class="some-customized-class" :checked="false" :disabled="true"></zan-switch>
<div class="page-switch__text">OFF, DISABLED</div>
</div>
<div class="page-switch__wrapper">
<zan-switch class="some-customized-class" :checked="true" :loading="true"></zan-switch>
<div class="page-switch__text">ON, LOADING</div>
</div>
<div class="page-switch__wrapper">
<zan-switch class="some-customized-class" :checked="false" :loading="true"></zan-switch>
<div class="page-switch__text">OFF, LOADING</div>
</div>
</div>
</div>

14
docs/examples/switch.vue
View File

@@ -5,17 +5,25 @@
<h2 class="page-sub-title">基础用法</h2>
<div class="page-switch">
<div class="page-switch__wrapper">
<z-switch class="some-customized-class" :checked="switchState" :on-change="updateState"></z-switch>
<zan-switch class="some-customized-class" :checked="switchState" :on-change="updateState"></zan-switch>
<div class="page-switch__text">{{switchStateText}}</div>
</div>
<div class="page-switch__wrapper">
<z-switch class="some-customized-class" :checked="true" :disabled="true"></z-switch>
<zan-switch class="some-customized-class" :checked="true" :disabled="true"></zan-switch>
<div class="page-switch__text">ON, DISABLED</div>
</div>
<div class="page-switch__wrapper">
<z-switch class="some-customized-class" :checked="false" :disabled="true"></z-switch>
<zan-switch class="some-customized-class" :checked="false" :disabled="true"></zan-switch>
<div class="page-switch__text">OFF, DISABLED</div>
</div>
<div class="page-switch__wrapper">
<zan-switch class="some-customized-class" :checked="true" :loading="true"></zan-switch>
<div class="page-switch__text">ON, LOADING</div>
</div>
<div class="page-switch__wrapper">
<zan-switch class="some-customized-class" :checked="false" :loading="true"></zan-switch>
<div class="page-switch__text">OFF, LOADING</div>
</div>
</div>
</div>
</template>