前端暗黑模式设计

218 阅读1分钟

image.png

theme.js:用vuex来保存当前的模式

_theme.css:暗黑模式下的样式代码

index.scss:主题的入口文件

themeConfig.js:配合theme的配置文件

var.css:全局样式文件

image.png

利用这个API document.documentElement.setAttribute(prop, val)进行主题的切换

image.png

image.png

在需要用到暗黑模式下的样式进行赋值

image.png