Commit b79b53ea6f7f41b7d9d80c3787365a7c08ce8acc
1 parent
5709f32e
Icon add color prop
Icon add color prop
Showing
2 changed files
with
14 additions
and
8 deletions
Show diff stats
src/components/icon/icon.vue
| @@ -7,20 +7,25 @@ | @@ -7,20 +7,25 @@ | ||
| 7 | export default { | 7 | export default { |
| 8 | props: { | 8 | props: { |
| 9 | type: String, | 9 | type: String, |
| 10 | - size: [Number, String] | 10 | + size: [Number, String], |
| 11 | + color: String | ||
| 11 | }, | 12 | }, |
| 12 | computed: { | 13 | computed: { |
| 13 | classes () { | 14 | classes () { |
| 14 | return `${prefixCls} ${prefixCls}-${this.type}` | 15 | return `${prefixCls} ${prefixCls}-${this.type}` |
| 15 | }, | 16 | }, |
| 16 | styles () { | 17 | styles () { |
| 18 | + let style = {}; | ||
| 19 | + | ||
| 17 | if (!!this.size) { | 20 | if (!!this.size) { |
| 18 | - return { | ||
| 19 | - 'font-size': `${this.size}px` | ||
| 20 | - } | ||
| 21 | - } else { | ||
| 22 | - return {} | 21 | + style['font-size'] = `${this.size}px`; |
| 22 | + } | ||
| 23 | + | ||
| 24 | + if (!!this.color) { | ||
| 25 | + style.color = this.color; | ||
| 23 | } | 26 | } |
| 27 | + | ||
| 28 | + return style; | ||
| 24 | } | 29 | } |
| 25 | } | 30 | } |
| 26 | } | 31 | } |
test/routers/slider.vue
| @@ -7,12 +7,13 @@ | @@ -7,12 +7,13 @@ | ||
| 7 | <!--<Slider :max="10"></Slider>--> | 7 | <!--<Slider :max="10"></Slider>--> |
| 8 | <!--<Slider :step="13"></Slider>--> | 8 | <!--<Slider :step="13"></Slider>--> |
| 9 | <!--<Slider :step="13" :max="60"></Slider>--> | 9 | <!--<Slider :step="13" :max="60"></Slider>--> |
| 10 | + <Icon type="checkmark-circled" size="40" color="#f60"></Icon> | ||
| 10 | </div> | 11 | </div> |
| 11 | </template> | 12 | </template> |
| 12 | <script> | 13 | <script> |
| 13 | - import { Slider } from 'iview'; | 14 | + import { Slider, Icon } from 'iview'; |
| 14 | export default { | 15 | export default { |
| 15 | - components: { Slider }, | 16 | + components: { Slider, Icon }, |
| 16 | data () { | 17 | data () { |
| 17 | return { | 18 | return { |
| 18 | value: [20, 50] | 19 | value: [20, 50] |