vue 主题切换深色系和浅色系

本文介绍了在Vue项目中如何实现深色和浅色主题的切换,主要涉及echart、Element-UI的颜色调整,以及使用CSS自定义变量来管理主题色。通过引用scss文件、动态添加或移除主题,以及针对echart和Element分别处理切换机制,实现了主题色的平滑过渡。用户切换的主题色将被保存在localstorage中,以保持登录后的设置。
摘要由CSDN通过智能技术生成

vue项目进行主题色切换,主要是echart、element-ui、主题色等三个位置的颜色调整

echart 和element 调用第三方框架进行切换,提前准备好其主题色

本系统主题色需要自己进行代码提取,经过网上查询,本次采用css自定义变量进行颜色主题切换,可参考下面链接

https://wanshi.netlify.app/2019/11/21/2019-11-22-vue%E9%A1%B9%E7%9B%AE%E4%BD%BF%E7%94%A8css%E5%8F%98%E9%87%8F%E5%AE%9E%E7%8E%B0%E4%B8%BB%E9%A2%98%E5%8C%96

https://juejin.cn/post/6844904122643120141
https://www.jianshu.com/p/ec9b20b55143
https://www.jianshu.com/p/35e0581629d2
https://www.jianshu.com/p/fe807f5ef394
https://juejin.cn/post/6844903981517373454
https://blog.csdn.net/chuanjiejue8361/article/details/101012978?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-2.control&dist_request_id=&depth_1-utm_source=distribu

评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值