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

View File

@ -24,15 +24,19 @@
<zan-button size="large">large</zan-button>
</zan-col>
</zan-row>
<zan-row gutter="10">
<zan-col span="8">
<zan-button type="primary" block="">normal</zan-button>
<zan-row>
<zan-col span="24">
<zan-button size="normal">normal</zan-button>
</zan-col>
<zan-col span="8">
<zan-button size="small" block="">small</zan-button>
</zan-row>
<zan-row>
<zan-col span="24">
<zan-button size="small">small</zan-button>
</zan-col>
<zan-col span="8">
<zan-button size="mini" block="">mini</zan-button>
</zan-row>
<zan-row>
<zan-col span="24">
<zan-button size="mini">mini</zan-button>
</zan-col>
</zan-row>
@ -53,6 +57,21 @@
</zan-col>
</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>
<style>
@component-namespace demo {
@ -63,10 +82,6 @@
.zan-col {
margin-bottom: 10px;
}
.button-group {
font-size: 0;
padding: 0 20px;
}
}
}
</style>

View File

@ -8,7 +8,7 @@
<zan-icon name="check"></zan-icon>
<zan-icon name="checked"></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="shop"></zan-icon>
<zan-icon name="photograph"></zan-icon>

View File

@ -36,6 +36,17 @@
</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>
<style>
@component-namespace demo {
@ -81,6 +92,10 @@ export default {
methods: {
popalert() {
alert('haha')
},
handleTabClick(index) {
alert(index);
}
}
};

View File

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