vant/packages/tag/index.vue
2018-11-01 16:16:26 +08:00

49 lines
796 B
Vue

<template>
<span
:class="[b({
mark,
plain,
round,
[size]: size
}), {
'van-hairline--surround': plain
}]"
:style="style"
>
<slot />
</span>
</template>
<script>
import create from '../utils/create';
import { RED, BLUE, GREEN } from '../utils/color';
const DEFAULT_COLOR = '#999';
const COLOR_MAP = {
danger: RED,
primary: BLUE,
success: GREEN
};
export default create({
name: 'tag',
props: {
size: String,
type: String,
mark: Boolean,
color: String,
plain: Boolean,
round: Boolean
},
computed: {
style() {
const color = this.color || COLOR_MAP[this.type] || DEFAULT_COLOR;
const key = this.plain ? 'color' : 'backgroundColor';
return { [key]: color };
}
}
});
</script>