資訊專(zhuān)欄INFORMATION COLUMN
摘要：一目標(biāo)提供幾種主題色給用戶選擇，然后根據(jù)用戶的選擇改變應(yīng)用的主題色二實(shí)現(xiàn)原理準(zhǔn)備不同主題色的樣式文件將用戶的選擇記錄在本地緩存中每次進(jìn)入應(yīng)用時(shí)，讀取緩存，根據(jù)緩存的信息判斷要加載哪個(gè)樣式文件即可三具體實(shí)現(xiàn)思路準(zhǔn)備四個(gè)對(duì)應(yīng)不同主題色的樣式文件
一.目標(biāo)
? 提供幾種主題色給用戶選擇，然后根據(jù)用戶的選擇改變應(yīng)用的主題色；
二.實(shí)現(xiàn)原理??1.準(zhǔn)備不同主題色的樣式文件；
??2.將用戶的選擇記錄在本地緩存中；
??3.每次進(jìn)入應(yīng)用時(shí)，讀取緩存，根據(jù)緩存的信息判斷要加載哪個(gè)樣式文件即可；
2.在主頁(yè)給用戶提供主題色選擇的html：
```
toggleSkin(index){
setItem("skin",index) //將最新的主題色名稱(chēng)更新到本地緩存中
this.loadingToast("主題色更換中..")
location.reload() //主題色更改后刷新頁(yè)面
}
```
3.主題色選擇后，在入口文件根據(jù)緩存判斷要加載哪個(gè)主題色樣式：
var aa=""
if(getItem("skin")=="0"){
aa="app"
}else if(getItem("skin")=="1"){
aa="app-skin1"
}else if(getItem("skin")=="2"){
aa="app-skin2"
}else if(getItem("skin")=="3"){
aa="app-skin3"
}else{
aa="app"
}
require([`./static/css/${aa}.scss`], function(list){});
??在這里遇到了一個(gè)坑，剛開(kāi)始的時(shí)候我是直接用 require(./static/css/${aa}.scss);的，結(jié)果不知道為什么把四個(gè)樣式文件都加載了，改成上面那個(gè)就沒(méi)問(wèn)題了，有空再研究一下require；
四.其他?? 賣(mài)個(gè)小廣告：我有一個(gè)小程序，可以掃碼商品的條碼進(jìn)行留言；別人掃同一個(gè)商品的條碼就可以看到你的留言；
?? 讓條形碼變成你的郵差~~~~
?? 歡迎掃碼體驗(yàn)：
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/96902.html
摘要：之前在做網(wǎng)站換膚，所以今天想聊聊網(wǎng)站換膚的實(shí)現(xiàn)。一般實(shí)現(xiàn)如上圖，我們會(huì)看到在某些網(wǎng)站的右上角會(huì)出現(xiàn)這么幾個(gè)顏色塊，點(diǎn)擊不同的顏色塊，網(wǎng)站的整體顏色就被替換了。 之前在做網(wǎng)站換膚，所以今天想聊聊網(wǎng)站換膚的實(shí)現(xiàn)。網(wǎng)頁(yè)換膚就是修改顏色值，因此重點(diǎn)就在于怎么來(lái)替換。 一般實(shí)現(xiàn) showImg(https://user-images.githubusercontent.com/12515800/...
摘要：社區(qū)的認(rèn)可目前已經(jīng)是相關(guān)最多的開(kāi)源項(xiàng)目了，體現(xiàn)出了社區(qū)對(duì)其的認(rèn)可。監(jiān)聽(tīng)事件手動(dòng)維護(hù)列表這樣我們就簡(jiǎn)單的完成了拖拽排序。 完整項(xiàng)目地址：vue-element-admin 系類(lèi)文章一：手摸手，帶你用vue擼后臺(tái) 系列一(基礎(chǔ)篇)系類(lèi)文章二：手摸手，帶你用vue擼后臺(tái) 系列二(登錄權(quán)限篇)系類(lèi)文章三：手摸手，帶你用vue擼后臺(tái) 系列三(實(shí)戰(zhàn)篇）系類(lèi)文章四：手摸手，帶你用vue擼后臺(tái) 系列...
摘要：社區(qū)的認(rèn)可目前已經(jīng)是相關(guān)最多的開(kāi)源項(xiàng)目了，體現(xiàn)出了社區(qū)對(duì)其的認(rèn)可。監(jiān)聽(tīng)事件手動(dòng)維護(hù)列表這樣我們就簡(jiǎn)單的完成了拖拽排序。 完整項(xiàng)目地址：vue-element-admin 系類(lèi)文章一：手摸手，帶你用vue擼后臺(tái) 系列一(基礎(chǔ)篇)系類(lèi)文章二：手摸手，帶你用vue擼后臺(tái) 系列二(登錄權(quán)限篇)系類(lèi)文章三：手摸手，帶你用vue擼后臺(tái) 系列三(實(shí)戰(zhàn)篇）系類(lèi)文章四：手摸手，帶你用vue擼后臺(tái) 系列...
摘要：最近項(xiàng)目中要實(shí)現(xiàn)一個(gè)換膚的功能，大體想了下，記錄一下思路要實(shí)現(xiàn)換膚功能，目標(biāo)就是打包生成多份皮膚文件，需要哪個(gè)就用哪個(gè)打包生成多份皮膚文件因?yàn)轫?xiàng)目是使用構(gòu)建的，要想生成多份文件，就要在入口中配置多個(gè)入口文件，每個(gè)入口文件會(huì)提取出一個(gè)文件中整 source 最近項(xiàng)目中要實(shí)現(xiàn)一個(gè)換膚的功能，大體想了下，記錄一下思路 要實(shí)現(xiàn)換膚功能，目標(biāo)就是打包生成多份皮膚文件，需要哪個(gè)就用哪個(gè) 打包生成多...
閱讀 1970·2021-11-22 09:34
閱讀 1191·2021-10-09 09:44
閱讀 3067·2021-09-29 09:35
閱讀 3653·2021-09-14 18:01
閱讀 1519·2021-08-16 10:49
閱讀 1119·2019-08-29 14:11
閱讀 877·2019-08-29 12:47
閱讀 3102·2019-08-26 13:47
