看了一篇比較不錯的文章，正好最近也有用到一些技術棧https://baijiahao.baidu.com/s?id=1675077634232259800&wfr=spider&for=pc
開拓視野

i18n 國際化 在mindworks官網(wǎng)項目里，用到了i18n做多語言適配。

• 如在vue中使用vue-i18n

const i18n = new VueI18n({
    locale: 'en', // 語言標識
    messages: { // 對應的語言適配的文檔
        'zh': require('./common/lang/zh'), // 用module.exports導出
        'en': require('./common/lang/en')} 
    }
)

const app = new Vue({
    router,
    i18n,
    ...App
}).$mount('#app')

i18n.locale = 'zh' // 這樣可以切換語言

// 可以和vue-store聯(lián)用，把locale作為store中的一個狀態(tài)，以便變換

$t('massages.xxx.xxx') // 引用文檔 可作為動態(tài)數(shù)據(jù)

和element-ui聯(lián)用出現(xiàn)的問題

• 頁面刷新后，通過按鈕切換的語言還原成了最初的語言，無法保存
• 框架內(nèi)部自帶的提示文字無法更改，比如像時間選擇框內(nèi)部中的提示文字

對問題一： 初始化i18n實例的時候可以從localstorage中獲取
對問題二：

i18n.js

import Vue from 'vue'
import VueI18n from 'vue-i18n'
import locale from 'element-ui/lib/locale';
import zh from './langs/zh'
import en from './langs/en'
// element-ui 自帶的多語言文檔
import enLocale from 'element-ui/lib/locale/lang/en' 
import zhLocale from 'element-ui/lib/locale/lang/zh-CN'


Vue.use(VueI18n)

const messages = {
  // 合并兩個對象
  en: Object.assign(en, enLocale), 
  zh: Object.assign(zh, zhLocale)
}

console.log(messages.zh)

const i18n = new VueI18n({
  locale: localStorage.getItem('locale') || 'zh',
  messages 
})


locale.i18n((key, value) => i18n.t(key, value)) //為了實現(xiàn)element插件的多語言切換

export default i18n

L10n (L和n之間的10個字母)或本地化是檢測用戶的本地國家（或地方）并根據(jù)其位置調(diào)整網(wǎng)站的過程。

• 這個目前沒用過，以后有機會的話再細看吧

a11y 提高頁面可訪問性

有很多方法，包括：

• 使用 alt 屬性進行圖像處理
• 添加 ARIA屬性 來描述內(nèi)容
• 允許文本大小定制
• 提供高對比度模式
  用 TAB 或者↑↓←→ 鍵處理鍵盤導航

• React —react-a11y。
• Vue.js —插件vue-a11y管理可訪問性