Parcourir la source

fix: remove useStorage dependency from app store

useStorage from @vueuse/core was causing store initialization to fail
in production, resulting in missing store properties.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
yb il y a 2 semaines
Parent
commit
45f4341285
2 fichiers modifiés avec 25 ajouts et 7 suppressions
  1. 1 4
      src/components/LangDropdown.vue
  2. 24 3
      src/store/app.ts

+ 1 - 4
src/components/LangDropdown.vue

@@ -19,7 +19,6 @@ import { computed } from 'vue'
 import { ArrowDown } from '@element-plus/icons-vue'
 import { Icon } from '@iconify/vue'
 import { useAppStore } from '@/store/app'
-import i18n from '@/locales'
 
 const appStore = useAppStore()
 
@@ -28,9 +27,7 @@ const currentLangLabel = computed(() => {
 })
 
 function handleLanguage(lang: string) {
-  // 直接设置 store 的 language 值和 i18n locale
-  appStore.language = lang
-  i18n.global.locale.value = lang
+  appStore.changeLanguage(lang)
 }
 </script>
 

+ 24 - 3
src/store/app.ts

@@ -1,6 +1,5 @@
 import { defineStore } from 'pinia'
 import { ref, computed } from 'vue'
-import { useStorage } from '@vueuse/core'
 // 导入 Element Plus 中英文语言包
 import zhCn from 'element-plus/es/locale/lang/zh-cn'
 import en from 'element-plus/es/locale/lang/en'
@@ -9,13 +8,29 @@ import i18n from '@/locales'
 // 默认语言从环境变量获取
 const DEFAULT_LANG = import.meta.env.VITE_APP_LANG || 'zh-cn'
 
+// 从 localStorage 获取初始语言
+function getInitialLanguage(): string {
+  try {
+    const stored = localStorage.getItem('language')
+    if (stored) {
+      const parsed = JSON.parse(stored)
+      if (parsed === 'zh-cn' || parsed === 'en') {
+        return parsed
+      }
+    }
+  } catch {
+    // ignore
+  }
+  return DEFAULT_LANG
+}
+
 export const useAppStore = defineStore('app', () => {
   // 侧边栏状态
   const sidebarOpened = ref(true)
   const loading = ref(false)
 
-  // 语言:开发环境使用 ref(每次启动用环境变量),生产环境使用 useStorage(持久化用户选择)
-  const language = import.meta.env.DEV ? ref(DEFAULT_LANG) : useStorage('language', DEFAULT_LANG)
+  // 语言:使用简单的 ref,手动处理持久化
+  const language = ref(getInitialLanguage())
   const size = ref<'default' | 'small' | 'large'>('default')
 
   /**
@@ -50,6 +65,12 @@ export const useAppStore = defineStore('app', () => {
   function changeLanguage(val: string) {
     language.value = val
     i18n.global.locale.value = val
+    // 手动保存到 localStorage
+    try {
+      localStorage.setItem('language', JSON.stringify(val))
+    } catch {
+      // ignore
+    }
   }
 
   /**