vu2 :style 如何实现 颜色值 rgba 半透明 十六进制颜色值转RGB方法
效果:
view部分:
<view :style="{backgroundColor:'rgba('+convertHexToRgb(info.bg_color)+',0.25)'}"> Text </view>
备注:
info.bg_color是变量 示例:#00a2ff
js部分:
methods: { //十六进制颜色值转RGB方法 hexToRgb(hex) { var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); return result? { r: parseInt(result[1], 16), g: parseInt(result[2], 16), b: parseInt(result[3], 16) } : null; }, convertHexToRgb(hexColor) { let rgb = this.hexToRgb(hexColor); let res = rgb.r+','+rgb.g+','+rgb.b; console.log(`rgb(${rgb.r}, ${rgb.g}, ${rgb.b})`); return res; } }