# 颜色转换
# hexToRgb
<template>
<div class="wrapper">
<text>hexToRgb: hex格式转换为Rgb</text>
</div>
</template>
<script>
export default {
data:()=> ({
name: 'hexToRgb',
}),
methods: {
colorTransformHandler() {
let color = '#267aff'
//hex格式转换为Rgb格式
let res = this.$util.hexToRgb(color)
this.$toast(res)
}
}
}
</script>
<style scoped>
.wrapper{
background-color: #ffffff;
}
</style>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
# 参数
- 传参描述：
| Params | Type | Required | default | Value |
|---|---|---|---|---|
sColor | String | Y | - | 传入hex色值 |
isStr | Boolean | N | true | true | false |
# rgbToHex
<template>
<div class="wrapper">
<text>rgbToHex: rgb格式转换为Hex</text>
</div>
</template>
<script>
export default {
data:()=> ({
name: 'hexToRgb',
}),
methods: {
colorTransformHandler() {
let color = 'rgb(255,0,0)'
//rgb格式转换为hex格式
let res = this.$util.rgbToHex(color)
this.$toast(res)
}
}
}
</script>
<style scoped>
.wrapper{
background-color: #ffffff;
}
</style>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
# 参数
- 传参描述：
| Params | Type | Required | default | Value |
|---|---|---|---|---|
rgb | String | Y | - | 传入rgb色值 |
# 颜色过渡
# colorGradient
<template>
<div class="wrapper">
<text>colorGradient: 颜色过渡</text>
</div>
</template>
<script>
export default {
data:()=> ({
name: 'colorGradient',
}),
methods: {
colorTransformHandler() {
let startColor = 'rgb(255,0,0)'
let endColor = 'rgb(0,0,255)'
let step = 10
//rgb格式转换为hex格式
let res = this.$util.colorGradient(startColor,endColor,step)
this.$toast(res)
}
}
}
</script>
<style scoped>
.wrapper{
background-color: #ffffff;
}
</style>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
# 参数
- 传参描述：
| Params | Type | Required | default | Value |
|---|---|---|---|---|
startColor | String | N | rgb(255,0,0) | 起始rgb色值 |
endColor | String | N | rgb(0,0,255) | 起始rgb色值 |
step | String | Number | 10 | 步长 |