Commit eca8907a11c28d816c3da5a0667f45a38a499012

Authored by 江麻妞
Committed by GitHub
1 parent e1123a2c

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
src/locales/setupI18n.ts
@@ -3,7 +3,7 @@ import type { I18n, I18nOptions } from 'vue-i18n'; @@ -3,7 +3,7 @@ import type { I18n, I18nOptions } from 'vue-i18n';
3 3
4 import { createI18n } from 'vue-i18n'; 4 import { createI18n } from 'vue-i18n';
5 5
6 -import { setLoadLocalePool } from './useLocale'; 6 +import { setLoadLocalePool, setHtmlPageLang } from './useLocale';
7 import { localeSetting } from '/@/settings/localeSetting'; 7 import { localeSetting } from '/@/settings/localeSetting';
8 import { useLocaleStoreWithOut } from '/@/store/modules/locale'; 8 import { useLocaleStoreWithOut } from '/@/store/modules/locale';
9 9
@@ -16,7 +16,8 @@ async function createI18nOptions(): Promise<I18nOptions> { @@ -16,7 +16,8 @@ async function createI18nOptions(): Promise<I18nOptions> {
16 const locale = localeStore.getLocale; 16 const locale = localeStore.getLocale;
17 const defaultLocal = await import(`./lang/${locale}.ts`); 17 const defaultLocal = await import(`./lang/${locale}.ts`);
18 const message = defaultLocal.default?.message ?? {}; 18 const message = defaultLocal.default?.message ?? {};
19 - 19 +
  20 + setHtmlPageLang(locale)
20 setLoadLocalePool((loadLocalePool) => { 21 setLoadLocalePool((loadLocalePool) => {
21 loadLocalePool.push(locale); 22 loadLocalePool.push(locale);
22 }); 23 });
src/locales/useLocale.ts
@@ -17,6 +17,10 @@ interface LangModule { @@ -17,6 +17,10 @@ interface LangModule {
17 17
18 const loadLocalePool: LocaleType[] = []; 18 const loadLocalePool: LocaleType[] = [];
19 19
  20 +export function setHtmlPageLang(locale: LocaleType) {
  21 + document.querySelector('html')?.setAttribute('lang', locale);
  22 +}
  23 +
20 export function setLoadLocalePool(cb: (loadLocalePool: LocaleType[]) => void) { 24 export function setLoadLocalePool(cb: (loadLocalePool: LocaleType[]) => void) {
21 cb(loadLocalePool); 25 cb(loadLocalePool);
22 } 26 }
@@ -30,7 +34,7 @@ function setI18nLanguage(locale: LocaleType) { @@ -30,7 +34,7 @@ function setI18nLanguage(locale: LocaleType) {
30 (i18n.global.locale as any).value = locale; 34 (i18n.global.locale as any).value = locale;
31 } 35 }
32 localeStore.setLocaleInfo({ locale }); 36 localeStore.setLocaleInfo({ locale });
33 - document.querySelector('html')?.setAttribute('lang', locale); 37 + setHtmlPageLang(locale)
34 } 38 }
35 39
36 export function useLocale() { 40 export function useLocale() {