ui/vant
1
0
Fork 0
mirror of https://github.com/youzan/vant.git synced 2025-10-21 19:24:16 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

add auto generate example js

Browse Source
This commit is contained in:
cookfront
2017-03-06 18:56:23 +08:00
parent b388aeaa02
commit 6b825e0718
39 changed files with 639 additions and 779 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
docs/examples/radio.vue
View File

@@ -1,41 +1,55 @@
<template>
<div class="page-radio">
<h1 class="page-title">Radio</h1>
<template><section class="demo-radio"><h1 class="demo-title">radio</h1><example-block title="基础用法">
<div class="zan-radios">
<zan-radio name="1" v-model="radio1">单选框1</zan-radio>
<zan-radio name="2" v-model="radio1">单选框2</zan-radio>
</div>
<div class="radio-demo-wrapper">
<h2 class="page-sub-title">基础用法</h2>
<zan-radio name="1" v-model="radio1">单选框1</zan-radio>
<zan-radio name="2" v-model="radio1">单选框2</zan-radio>
<h2 class="page-sub-title">禁用状态</h2>
<zan-radio name="1" v-model="radio2" disabled>未选中禁用</zan-radio>
<zan-radio name="2" v-model="radio2" disabled>选中且禁用</zan-radio>
<h2 class="page-sub-title">radio组</h2>
<zan-radio-group v-model="radio3">
<zan-radio name="1">单选框1</zan-radio>
<zan-radio name="2">单选框2</zan-radio>
</zan-radio-group>
</example-block><example-block title="禁用状态">
<div class="zan-radios">
<zan-radio name="1" v-model="radio2" disabled>未选中禁用</zan-radio>
<zan-radio name="2" v-model="radio2" disabled>选中且禁用</zan-radio>
</div>
<h2 class="page-sub-title">禁用radio组</h2>
<zan-radio-group v-model="radio3" disabled>
<zan-radio name="1">单选框1</zan-radio>
<zan-radio name="2">单选框2</zan-radio>
</zan-radio-group>
<h2 class="page-sub-title">与Cell组件一起使用</h2>
</div>
<zan-radio-group v-model="radio4">
<zan-cell-group>
<zan-cell><zan-radio name="1">单选框1</zan-radio></zan-cell>
<zan-cell><zan-radio name="2">单选框2</zan-radio></zan-cell>
</zan-cell-group>
</zan-radio-group>
</div>
</template>
</example-block><example-block title="radio组">
<div class="zan-radios">
<zan-radio-group v-model="radio3">
<zan-radio name="1">单选框1</zan-radio>
<zan-radio name="2">单选框2</zan-radio>
</zan-radio-group>
</div>
</example-block><example-block title="与Cell组件一起使用">
<zan-radio-group v-model="radio4">
<zan-cell-group>
<zan-cell><zan-radio name="1">单选框1</zan-radio></zan-cell>
<zan-cell><zan-radio name="2">单选框2</zan-radio></zan-cell>
</zan-cell-group>
</zan-radio-group>
</example-block></section></template>
<style>
@component-namespace demo {
@b radio {
.zan-radios {
padding: 0 20px;
.zan-radio {
margin: 10px 0;
}
}
}
}
</style>
<script>
import Vue from "vue";import ExampleBlock from "../components/example-block";Vue.component("example-block", ExampleBlock);
export default {
data() {
return {
@@ -46,14 +60,4 @@ export default {
};
}
};
</script>
<style>
.radio-demo-wrapper {
padding: 0 15px;
.zan-radio {
margin: 10px 0;
}
}
</style>
</script>