這篇文章帶給大家的內容是關於reac如何t實現更換皮膚顏色的功能,有一定的參考價值,有需要的朋友可以參考一下,希望對你有所幫助。
提供幾種主題色給使用者選擇,然後根據使用者的選擇改變應用的主題色;
1.準備不同主題色的樣式檔案;
2.將使用者的選擇記錄在本地快取中;
3.每次進入應用時,讀取緩存,根據緩存的資訊判斷要加載哪個樣式文件即可;
![](https://images2018.cnblogs.com/blog/1178432/201808/1178432-20180813142303707-1847250400.png)
" <span> <i></i> <i></i> <i></i> <i></i> </span> toggleSkin(index){ setItem('skin',index) //将最新的主题色名称更新到本地缓存中 this.loadingToast('主题色更换中..') location.reload() //主题色更改后刷新页面 } "
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){});
在這裡遇到了一個坑,剛開始的時候我是直接用require(./static/css/${aa}.scss
);的,結果不知道為什麼把四個樣式檔案都載入了,改成上面那個就沒問題了,有空再研究一下require;
相關推薦:
jQuery中的方法有哪些?jQuery中常用的方法(附程式碼)
以上是reac如何t實現更換皮膚顏色的功能的詳細內容。更多資訊請關注PHP中文網其他相關文章!