Commit 2a6f605814358a1c004dc9c2efa3952821946702

Authored by zhigang.li
1 parent c907cc97

fixed the bug about backgroundcolor when tag is checked

Showing 2 changed files with 9 additions and 3 deletions   Show diff stats
examples/routers/tag.vue
... ... @@ -14,7 +14,13 @@
14 14 <Tag closable color="red" checkable>标签三</Tag>
15 15 <Tag closable color="yellow" checkable>标签四</Tag>
16 16 <br><br>
  17 + <Tag color="blue" checkable>标签一</Tag>
  18 + <Tag color="green" checkable>标签二</Tag>
  19 + <Tag color="red" checkable>标签三</Tag>
  20 + <Tag color="yellow" checkable>标签四</Tag>
  21 + <br><br>
17 22 <Tag closable color="#EF6AFF" checkable>标签一</Tag>
  23 + <Tag color="#EF6AFF" checkable>标签一</Tag>
18 24 <Tag type="border" closable color="#EF6AFF" checkable>标签二</Tag>
19 25 <Tag type="dot" closable color="#EF6AFF" checkable>标签三</Tag>
20 26 <Tag closable color="default" checkable>标签四</Tag>
... ...
src/components/tag/tag.vue
... ... @@ -59,13 +59,13 @@
59 59 ];
60 60 },
61 61 wraperStyles () {
62   - return oneOf(this.color, initColorList) ? {} : {background: this.defaultTypeColor, borderColor: this.lineColor, color: this.lineColor};
  62 + return oneOf(this.color, initColorList) ? {} : {background: this.isChecked ? this.defaultTypeColor : 'transparent', borderWidth: '1px', borderStyle: 'solid', borderColor: this.lineColor, color: this.lineColor};
63 63 },
64 64 textClasses () {
65 65 return [
66 66 `${prefixCls}-text`,
67 67 this.type === 'border' ? (oneOf(this.color, initColorList) ? `${prefixCls}-color-${this.color}` : '') : '',
68   - (this.type !== 'dot' && this.type !== 'border' && this.color !== 'default') ? `${prefixCls}-color-white` : ''
  68 + (this.type !== 'dot' && this.type !== 'border' && this.color !== 'default') ? (this.isChecked ? `${prefixCls}-color-white` : '') : ''
69 69 ];
70 70 },
71 71 dotClasses () {
... ... @@ -96,7 +96,7 @@
96 96 return this.color !== undefined ? (oneOf(this.color, initColorList) ? '' : this.color) : '';
97 97 },
98 98 textColorStyle () {
99   - return oneOf(this.color, initColorList) ? {} : {color: this.lineColor};
  99 + return oneOf(this.color, initColorList) ? {} : ((this.type !== 'dot' && this.type !== 'border') ? (this.isChecked ? {color: this.lineColor} : {}) : {color: this.lineColor});
100 100 },
101 101 bgColorStyle () {
102 102 return oneOf(this.color, initColorList) ? {} : {background: this.dotColor};
... ...