鍍金池/ 問答/HTML5  HTML/ 如何通過后臺(tái)返回的顏色值,設(shè)置前端頁(yè)面主色調(diào)?

如何通過后臺(tái)返回的顏色值,設(shè)置前端頁(yè)面主色調(diào)?

需求:
一個(gè)vue的單頁(yè)應(yīng)用,需要根據(jù)后臺(tái)數(shù)據(jù)返回的basicColor參數(shù)自動(dòng)修改前端頁(yè)面主色調(diào)(圖片除外),
現(xiàn)在前端是使用less編寫的,使用less常量定義常用顏色,但是less編譯成css后也就不是常量了--|
,也就沒辦法動(dòng)態(tài)的修改主題色!求一個(gè)解決方案

回答
編輯回答
維他命

在計(jì)算屬性computed里寫入
computed:{

style:function(){
    return {
        background:'#'+后臺(tái)返回的basicColor,
    }
}

}
在需要修改的標(biāo)簽位置:style = "style"

2017年9月16日 11:59
編輯回答
冷溫柔

我看iview-admin的換主題功能是寫了好幾套CSS,根據(jù)選擇的主題再來動(dòng)態(tài)引入對(duì)應(yīng)的css這種方式來實(shí)現(xiàn)的。

2018年6月11日 20:48
編輯回答
忘了我

有個(gè)疑問:一般切換主題色不是前端預(yù)設(shè)好的么,為什么要后端返數(shù)據(jù)去渲染呢?那頁(yè)面在請(qǐng)求到數(shù)據(jù)之前和之后會(huì)有明顯的主題跳動(dòng)問題。
拿到數(shù)據(jù)再渲染顏色,很明顯只能通過js或者css去,巨麻煩。

2018年5月5日 22:52
編輯回答
薄荷糖

直接標(biāo)簽上改不也一樣么

:style="{ background: color}"


color:red  //換成你需要的
2017年7月11日 17:04