xueyawen
/
vue3-vant-mobile
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: change `lang` attribute when switching languages 

improve a11y
This commit is contained in:
wswmsword 2024-10-09 09:33:27 +08:00
parent e690478b84
commit 934ebb35c5
2 changed files with 12 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="zh-CN">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"/> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"/>

17
src/utils/i18n.ts
View File

@ -20,15 +20,19 @@ export const languageColumns: PickerColumn = [
/** 获取当前语言对应的语言包名称 */ /** 获取当前语言对应的语言包名称 */
function getI18nLocale() { function getI18nLocale() {
const locale = localStorage.getItem('language') || navigator.language const storedLocale = localStorage.getItem('language') || navigator.language
let locale = FALLBACK_LOCALE // 默认语言包
for (const l of languageColumns) { for (const l of languageColumns) {
const value = l.value as string const value = l.value as string
if (value === locale) if (value === storedLocale // 存在当前语言的语言包
return locale // 存在当前语言的语言包 || value.indexOf(storedLocale) === 0 // 存在当前语言的任意地区的语言包
else if (value.indexOf(locale) === 0) ) {
return value // 存在当前语言的任意地区的语言包 locale = value
break
}
} }
return FALLBACK_LOCALE // 使用默认语言包 document.querySelector('html').setAttribute('lang', locale)
return locale
} }
export const i18n = createI18n({ export const i18n = createI18n({
@ -43,6 +47,7 @@ export const locale = computed({
return i18n.global.locale.value return i18n.global.locale.value
}, },
set(language: string) { set(language: string) {
document.querySelector('html').setAttribute('lang', language)
localStorage.setItem('language', language) localStorage.setItem('language', language)
i18n.global.locale.value = language i18n.global.locale.value = language
Locale.use(language) Locale.use(language)