Browse Source

fix: Fix the problem that the `lang` attribute of `HTML` will not be set when it is first loaded (#682)

* refactor:  Encapsulate the function of changing the page language

* fix(lang): Fix the problem that the `lang` attribute of `HTML` will not be set when it is first loaded
江麻妞 3 năm trước cách đây
mục cha
commit
eca8907a11
2 tập tin đã thay đổi với 8 bổ sung3 xóa
  1. 3 2
      src/locales/setupI18n.ts
  2. 5 1
      src/locales/useLocale.ts

+ 3 - 2
src/locales/setupI18n.ts

@@ -3,7 +3,7 @@ import type { I18n, I18nOptions } from 'vue-i18n';
 
 import { createI18n } from 'vue-i18n';
 
-import { setLoadLocalePool } from './useLocale';
+import { setLoadLocalePool, setHtmlPageLang } from './useLocale';
 import { localeSetting } from '/@/settings/localeSetting';
 import { useLocaleStoreWithOut } from '/@/store/modules/locale';
 
@@ -16,7 +16,8 @@ async function createI18nOptions(): Promise<I18nOptions> {
   const locale = localeStore.getLocale;
   const defaultLocal = await import(`./lang/${locale}.ts`);
   const message = defaultLocal.default?.message ?? {};
-
+  
+  setHtmlPageLang(locale)
   setLoadLocalePool((loadLocalePool) => {
     loadLocalePool.push(locale);
   });

+ 5 - 1
src/locales/useLocale.ts

@@ -17,6 +17,10 @@ interface LangModule {
 
 const loadLocalePool: LocaleType[] = [];
 
+export function setHtmlPageLang(locale: LocaleType) {
+  document.querySelector('html')?.setAttribute('lang', locale);
+}
+
 export function setLoadLocalePool(cb: (loadLocalePool: LocaleType[]) => void) {
   cb(loadLocalePool);
 }
@@ -30,7 +34,7 @@ function setI18nLanguage(locale: LocaleType) {
     (i18n.global.locale as any).value = locale;
   }
   localeStore.setLocaleInfo({ locale });
-  document.querySelector('html')?.setAttribute('lang', locale);
+  setHtmlPageLang(locale)
 }
 
 export function useLocale() {