0
点赞
收藏
分享

微信扫一扫

vue主题换肤(持续更新,欢迎补充)

Gascognya 2021-09-24 阅读 73
vue相关Vue
需求概况

换肤要求侧边栏背景色,所有button,switch,高亮文字颜色等同时改变

项目概况

基于element-ui开发的vue项目,实现换肤主要使用vue样式绑定:style及封装el-button的组件,用户主题色存储在vuex

基本实现原理

想法比较无脑,控制主题颜色在vuex中存储,通过样式绑定以及自定义组件实现样式变更以达到换肤效果

一步步实现



做到这里基本满足了目前版本的换肤需求,后期如果其他换肤需求会持续更新
ps:其实还想做得更人性化一点的换肤,即用户在色彩盘中选择自己喜欢的颜色进行换肤,实现原理基本一致,这里没有使用css实现换肤就是有局限性,通过vuex来存储变量后期的可扩展性更强

各位如有更好的建议欢迎补充~~~

举报

相关推荐

0 条评论