27 lines
951 B
TypeScript
27 lines
951 B
TypeScript
// app/stores/global.ts - 全局通用状态（主题等）
|
|
//
|
|
// 颜色模式改用 useCookie 持久化，这样 SSR 和客户端都能读到同一份值，
|
|
// 避免因 localStorage 在 SSR 阶段不可用而产生水合不匹配（hydration mismatch）。
|
|
export const useGlobalStore = defineStore("theme", () => {
|
|
// 用 Nuxt 的 useCookie：服务端从 request cookie 读取，客户端和正常 cookie 一致
|
|
const _pref = useCookie<"light" | "dark">("color-mode", {
|
|
default: () => "light",
|
|
sameSite: "lax"
|
|
});
|
|
|
|
/** 当前是否深色模式 */
|
|
const isDark = computed(() => _pref.value === "dark");
|
|
|
|
/** 切换深色 / 浅色 */
|
|
const toggle = () => {
|
|
_pref.value = isDark.value ? "light" : "dark";
|
|
};
|
|
|
|
/** vue-sonner Toaster 的 theme prop 值，跟随当前模式 */
|
|
const toasterTheme = computed<"light" | "dark">(() =>
|
|
isDark.value ? "dark" : "light"
|
|
);
|
|
|
|
return { isDark, toggle, toasterTheme };
|
|
});
|