blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-24 18:36:51 +08:00
Code Issues Projects Releases Wiki Activity

Merge branch 'master' of gitlab.qima-inc.com:fe/zanui-vue

Browse Source
This commit is contained in:
cookfront 2017-03-23 20:40:01 +08:00
commit e454ce0cdc
4 changed files with 34 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
docs/examples-docs/badge.md
View File

@ -2,13 +2,28 @@
### 基础用法 ### 基础用法
<script>
export default {
data() {
return {
activeKey: '2'
};
},
methods: {
onItemClick(e, data) {
this.activeKey = data.mark;
}
}
};
</script>
:::demo 基础用法 :::demo 基础用法
```html ```html
<zan-badge-group active-key="2"> <zan-badge-group :active-key="activeKey">
<zan-badge mark="0" title="热销榜" info="8" url="http://baidu.com"></zan-badge> <zan-badge mark="0" title="热销榜" info="8" url="http://baidu.com" @click="onItemClick"></zan-badge>
<zan-badge mark="1" title="花式寿司" info="99"></zan-badge> <zan-badge mark="1" title="花式寿司" info="99" @click="onItemClick"></zan-badge>
<zan-badge mark="2" title="火炽寿司"></zan-badge> <zan-badge mark="2" title="火炽寿司" @click="onItemClick"></zan-badge>
<zan-badge mark="3" title="手握寿司" info="199"></zan-badge> <zan-badge mark="3" title="手握寿司" info="199" @click="onItemClick"></zan-badge>
</zan-badge-group> </zan-badge-group>
``` ```
::: :::

6
packages/badge/src/badge-group.vue
View File

@ -14,12 +14,6 @@
type: [Number, String], type: [Number, String],
default: 0 default: 0
} }
},
data() {
return {
computedActiveKey: this.activeKey
};
} }
}; };
</script> </script>

14
packages/badge/src/badge.vue
View File

@ -19,21 +19,27 @@ export default {
required: true required: true
}, },
url: { url: {
type: String type: String,
default: 'javascript:;'
}, },
info: { info: {
type: String type: String
} }
}, },
methods: { methods: {
handleClick() { handleClick(e) {
this.$parent.computedActiveKey = this.mark; this.$emit('click', e, {
mark: this.mark,
title: this.title,
url: this.url,
info: this.info
});
} }
}, },
computed: { computed: {
classNames() { classNames() {
return { return {
'is-select': this.mark === this.$parent.computedActiveKey 'is-select': this.mark === this.$parent.activeKey
}; };
} }
} }

6
packages/zanui-css/src/badge.css
View File

@ -13,14 +13,14 @@
display: block; display: block;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
padding: 20px 15px; padding: 20px 12px;
box-sizing: border-box; box-sizing: border-box;
line-height: 14px; line-height: 1.4;
background-color: $c-background; background-color: $c-background;
color: $c-gray-darker; color: $c-gray-darker;
font-size: 14px; font-size: 14px;
text-decoration: none; text-decoration: none;
white-space: nowrap; word-break: break-all;
@e active { @e active {
display: none; display: none;
position: absolute; position: absolute;