VUE+SCSS切换主题

Question

如图

我始终不明白的是

@each $theme-name, $theme-map in $themes 这句代码，$theme-name, $theme-map 分别表示什么？

$theme-name如果表示的是light和dark，还是background_color和 text-color？如果是前者，那$theme-map就表示这个主题中所有的样式 ，那这条语句 $theme-map: $theme-map !global就有语法错误了 ，如果是后者， 是不是选择了主题，如dark,$themes值就不是之前定义的值了 ， 值就是(
background_color: #181c27,//背景
text-color: rgba(255, 255, 255, 0.65), // 主文本色
)，那前面的循环我就明白了，它又是如何实现的呢？

https://img-mid.csdnimg.cn/release/static/image/mid/ask/048464928356172.png?x-oss-process=image/auto-orient,1/resize,w_320,m_lfit

Answer 1

forEach 循环 $theme-map代表的key值 ===> light 或者 dark $theme-map 代表的是 {}里面的, 这条语句 $theme-map: $theme-map !global类似三元运算符 先判断这个值是否合法 后加!import 的作用 纯属给人经验 希望能给你启发