blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-05-25 07:49:15 +08:00
Code Issues Projects Releases Wiki Activity

fix tabs

Browse Source
This commit is contained in:
cookfront 2017-03-30 14:33:41 +08:00
parent a11ccb635b
commit 3017419c8e
4 changed files with 45 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
docs/examples-dist/button.vue
View File

@ -24,15 +24,19 @@
<zan-button size="large">large</zan-button> <zan-button size="large">large</zan-button>
</zan-col> </zan-col>
</zan-row> </zan-row>
<zan-row gutter="10"> <zan-row>
<zan-col span="8"> <zan-col span="24">
<zan-button type="primary" block="">normal</zan-button> <zan-button size="normal">normal</zan-button>
</zan-col> </zan-col>
<zan-col span="8"> </zan-row>
<zan-button size="small" block="">small</zan-button> <zan-row>
<zan-col span="24">
<zan-button size="small">small</zan-button>
</zan-col> </zan-col>
<zan-col span="8"> </zan-row>
<zan-button size="mini" block="">mini</zan-button> <zan-row>
<zan-col span="24">
<zan-button size="mini">mini</zan-button>
</zan-col> </zan-col>
</zan-row> </zan-row>
@ -53,6 +57,21 @@
</zan-col> </zan-col>
</zan-row> </zan-row>
</example-block><example-block title="">
<zan-row>
<zan-col span="24">
<zan-button type="primary" bottom-action="">立即购买</zan-button>
</zan-col>
</zan-row>
<zan-row>
<zan-col span="12">
<zan-button bottom-action="">加入购物车</zan-button>
</zan-col>
<zan-col span="12">
<zan-button type="primary" bottom-action="">立即购买</zan-button>
</zan-col>
</zan-row>
</example-block></section></template> </example-block></section></template>
<style> <style>
@component-namespace demo { @component-namespace demo {
@ -63,10 +82,6 @@
.zan-col { .zan-col {
margin-bottom: 10px; margin-bottom: 10px;
} }
.button-group {
font-size: 0;
padding: 0 20px;
}
} }
} }
</style> </style>

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

@ -8,7 +8,7 @@
<zan-icon name="check"></zan-icon> <zan-icon name="check"></zan-icon>
<zan-icon name="checked"></zan-icon> <zan-icon name="checked"></zan-icon>
<zan-icon name="like-o"></zan-icon> <zan-icon name="like-o"></zan-icon>
<zan-icon name="like"></zan-icon> <zan-icon name="like" :style="{ color: '#f44' }"></zan-icon>
<zan-icon name="chat"></zan-icon> <zan-icon name="chat"></zan-icon>
<zan-icon name="shop"></zan-icon> <zan-icon name="shop"></zan-icon>
<zan-icon name="photograph"></zan-icon> <zan-icon name="photograph"></zan-icon>

15
docs/examples-dist/tab.vue
View File

@ -36,6 +36,17 @@
</zan-tabs> </zan-tabs>
</example-block><example-block title="click事件">
<zan-tabs @click="handleTabClick">
<zan-tab title="选项一">内容一</zan-tab>
<zan-tab title="选项二">内容二</zan-tab>
<zan-tab title="选项三">内容三</zan-tab>
<zan-tab title="选项四">内容四</zan-tab>
<zan-tab title="选项五">内容五</zan-tab>
</zan-tabs>
</example-block></section></template> </example-block></section></template>
<style> <style>
@component-namespace demo { @component-namespace demo {
@ -81,6 +92,10 @@ export default {
methods: { methods: {
popalert() { popalert() {
alert('haha') alert('haha')
},
handleTabClick(index) {
alert(index);
} }
} }
}; };

3
docs/examples-docs/tab.md
View File

@ -141,6 +141,8 @@ export default {
### click事件 ### click事件
可以在`zan-tabs`上绑定一个`click`事件，事件处理函数有一个参数，参数为对应`tab`在`tabs`中的索引。
:::demo click事件 :::demo click事件
```html ```html
<zan-tabs @click="handleTabClick"> <zan-tabs @click="handleTabClick">
@ -173,6 +175,7 @@ export default {
### zan-tab API ### zan-tab API
| 参数 | 说明 | 类型 | 默认值 | 可选 | | 参数 | 说明 | 类型 | 默认值 | 可选 |
|-----------|-----------|-----------|-------------|-------------| |-----------|-----------|-----------|-------------|-------------|
| title | tab的标题 | `string` | | | | title | tab的标题 | `string` | | |