Progress prop strokeColor support Array type, and support the linear-…

This commit is contained in:
mo.duan 2019-09-06 15:19:01 +08:00
parent 61a07db243
commit 730eba8adb
2 changed files with 14 additions and 3 deletions

View file

@ -12,10 +12,17 @@
<Progress :percent="100"></Progress>
<Progress :percent="25" hide-info></Progress>
<Progress :percent="10" :stroke-width="20" text-inside></Progress>
<Progress :percent="90" :stroke-color="color1"></Progress>
<Progress :percent="90" :stroke-color="color2" status="active"></Progress>
</div>
</template>
<script>
export default {
data () {
return {
color1: '#ff6600',
color2: ['#108ee9', '#87d068']
}
}
}
</script>

View file

@ -54,7 +54,7 @@
default: false
},
strokeColor: {
type: String
type: [String, Array]
},
textInside: {
type: Boolean,
@ -93,7 +93,11 @@
};
if (this.strokeColor) {
if (typeof this.strokeColor === 'string') {
style['background-color'] = this.strokeColor;
} else {
style['background-image'] = `linear-gradient(to right, ${this.strokeColor[0]} 0%, ${this.strokeColor[1]} 100%)`;
}
}
return style;