feat: 黑暗模式支持缓存

yulimchen · Jul 1, 2023 · b398939 · b398939
1 parent 53b1557
commit b398939
Showing 1 changed file with 13 additions and 1 deletion.
diff --git a/src/store/modules/darkMode.ts b/src/store/modules/darkMode.ts
@@ -1,18 +1,30 @@
 import { defineStore } from "pinia";
 import { store } from "@/store";
 
+const darkModeKey = "__dark_mode__";
+const isDarkMode = () => {
+  const darkMode = window.localStorage.getItem(darkModeKey);
+  if (darkMode) {
+    return darkMode === "true";
+  } else {
+    return window.matchMedia("(prefers-color-scheme: dark)").matches;
+  }
+};
+
 export const useDarkModeStore = defineStore({
   id: "dark-mode",
   state: () => ({
-    darkMode: false
+    darkMode: isDarkMode()
   }),
   actions: {
     toggleDarkMode() {
       this.darkMode = !this.darkMode;
       if (this.darkMode) {
         document.documentElement.classList.add("dark");
+        window.localStorage.setItem(darkModeKey, "true");
       } else {
         document.documentElement.classList.remove("dark");
+        window.localStorage.setItem(darkModeKey, "false");
       }
     }
   }