0 环境
1 参考文档
2 前言
要想在线看源码的，请点开上面的参考文档 App.vue查看具体源码，本地的源码位置：src/App.vue，下面我就会直接用App.vue替代了。而我们主要讲的是init theme就是App.vue的第21-22行，点进去也就是useTheme.ts下的initTheme，下面我会直接说它的，直接说看第几行说的就是这个文件了。
3 灰色和弱色切换
看下图代码，请看103-104行，isGrey和isWeak这两个值和布局样式有关，请看下面第二图里面的两个红框，后面会单独说，现在是两个值判断，为真是，它们都是调用的changeGreyOrWeak，点进去看下。
请看changeGreyOrWeak(第48-58行)，48行拿到body，若是value是false，返回并移除style，若是value是true，先设置styles对象，它的键值对有grey:灰度化、weak:颜色反转，body重新设置style键对应的value(这里的value是拿到styles里对应的值)，56行这里用了三元运算，主要判断type类别，得到一个属性名，给57行globalStore.setGlobalState用的，对该属性设置为false。
4 总结
其实灰色和弱色切换，它的样式是基于body上的加入或移除style，和之前在html上加入和移除不一样，那个是因为style有其它全局的样式，只能单独用类名来控制暗黑模式。这里
changeGreyOrWeak初始化，需要先前置判断的(灰色/弱色为true，才可)，和前面之前那个直接侧边栏这类的主题加载还不同，并且changeGreyOrWeak最后还要改变控制灰色/弱色变量为false，也就说，只会初始化一次。
