使用x-header,查看文檔發現有個樣式變量,可以改變x-header的樣式
這玩意怎么用呢?
1.在項目中創建一個.less樣式文件,例如我這里是創建一個src/style/vux_theme.less文件
2.編輯vux_theme.less文件
如這里是,copy x-header的@header-background-color ,並將值設置為#353535
意思是將x-header的背景顏色從默認的#35495e 改為 #353535
3.很重要,很重要,很重要:配置引入自己定義的vux_theme.less樣式文件,如下:
在項目的build/webpack.base.conf.js中找到引入vux-ui的地方,在下方添加語句
{name:'less-theme',path:'src/style/vux_theme.less'},//這里的路徑為自定的less文件的路徑
npm run dev 重新編譯,會發現所有的x-header都統一更換了背景色