Tag add type props,and optimize style
Tag add type props,and optimize style
This commit is contained in:
parent
a901da64ed
commit
382c000c8f
8 changed files with 146 additions and 17 deletions
|
@ -1,7 +1,6 @@
|
|||
<template>
|
||||
<div v-if="!closed" :class="classes" transition="fade">
|
||||
<span :class="textClasses"><slot></slot></span>
|
||||
<Icon v-if="closable" type="ios-close-empty" @click="close"></Icon>
|
||||
<span :class="dotClasses" v-if="showDot"></span><span :class="textClasses"><slot></slot></span><Icon v-if="closable" type="ios-close-empty" @click="close"></Icon>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
@ -21,6 +20,11 @@
|
|||
validator (value) {
|
||||
return oneOf(value, ['blue', 'green', 'red', 'yellow']);
|
||||
}
|
||||
},
|
||||
type: {
|
||||
validator (value) {
|
||||
return oneOf(value, ['border', 'dot']);
|
||||
}
|
||||
}
|
||||
},
|
||||
data () {
|
||||
|
@ -33,12 +37,20 @@
|
|||
return [
|
||||
`${prefixCls}`,
|
||||
{
|
||||
[`${prefixCls}-${this.color}`]: !!this.color
|
||||
[`${prefixCls}-${this.color}`]: !!this.color,
|
||||
[`${prefixCls}-${this.type}`]: !!this.type,
|
||||
[`${prefixCls}-closable`]: this.closable
|
||||
}
|
||||
]
|
||||
},
|
||||
textClasses () {
|
||||
return `${prefixCls}-text`;
|
||||
},
|
||||
dotClasses () {
|
||||
return `${prefixCls}-dot-inner`;
|
||||
},
|
||||
showDot () {
|
||||
return !!this.type && this.type === 'dot';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue