- Published on
前端全局换肤
- Authors

- Name
- MissTree
全局肤色替换
将后台配置的颜色 覆盖到全局HTML上 
formatConfig = this.processSkinConfig(themeConfig)
this.setDomStyle(formatConfig)
/**
* @desc: 处理全局皮肤配置的方法
* @argument themeConfig 原始配置数据
*/
processSkinConfig = function (themeConfig) {
// 数据结构处理
let allKey = {};
Object.keys(themeConfig).forEach(keyItem => {
let ret = themeConfig[keyItem];
typeof ret === 'string' && (ret = [ret]);
allKey[`--${kebabCase(keyItem)}`] = ret[0];
ret[1] && (allKey[`--rgb-${kebabCase(keyItem)}`] = ret[1]);
})
}
// 更改全局样式
setDomStyle = (allKey)=>{
Object.keys(allKey).forEach(el => {
document.documentElement.style.setProperty(el, allKey[el]);
})
}