? ? ? ? 一般情況下，我所理解的多語(yǔ)言，是指寫死的靜態(tài)結(jié)構(gòu)里的文字，對(duì)這個(gè)進(jìn)行多語(yǔ)言操作，比如一些固定的菜單、導(dǎo)航欄之類的，不涉及后臺(tái)獲取數(shù)據(jù)的部分，進(jìn)行多語(yǔ)言。但由于公司產(chǎn)品以及老板對(duì)于技術(shù)理解程度和要求不同，于是需要進(jìn)行動(dòng)態(tài)化的多語(yǔ)言，下面先簡(jiǎn)單介紹一下開發(fā)的背景和需求，跳過看實(shí)現(xiàn)請(qǐng)下拉到最后。

? ? ? ?項(xiàng)目是一套OA管理系統(tǒng)，前臺(tái)的菜單以及導(dǎo)航以及各個(gè)組部件，均為后臺(tái)控制名稱，并且這個(gè)名稱后臺(tái)可以由用戶自己修改，以B站導(dǎo)航為例，后臺(tái)會(huì)存儲(chǔ)菜單、導(dǎo)航欄里每一個(gè)模塊的名稱、對(duì)應(yīng)的組件/部件號(hào)、識(shí)別編碼，例如“首頁(yè)”，同樣都是這兩個(gè)字，但是在不同的訪問狀態(tài)下，會(huì)對(duì)應(yīng)不同的識(shí)別碼，如公司訪問，識(shí)別碼是M01_01，那么角色訪問就會(huì)變成M02_01，崗位M03_01等。并且由于中文的特殊性，同一個(gè)詞在不同的語(yǔ)境下會(huì)有不同的含義，所以不能使用中文值作為KEY，因?yàn)闀?huì)出現(xiàn)同一個(gè)中文，但對(duì)應(yīng)不同英文的情況。

????于是只能使用識(shí)別碼來做KEY，雖然會(huì)有浪費(fèi)，并且浪費(fèi)的還很多，但目前還沒有想到更好的解決方案，如果后續(xù)公司再有優(yōu)化升級(jí)，我再回來更新。KEY的問題解決了，現(xiàn)在新的需求是，多語(yǔ)言支持用戶自定義，由于有N家公司同時(shí)使用，所以要根據(jù)不同的公司加載不同的多語(yǔ)言文件， 且為了節(jié)省資源，公司目前采用的方案是動(dòng)態(tài)生成多語(yǔ)言文件(因?yàn)椴⒉皇撬锌蛻舳紩?huì)閑著無聊去改翻譯。我可以不用，但你必須得有.jpg)，項(xiàng)目初始有中、英兩個(gè)靜態(tài)文件，如果用戶修改了默認(rèn)翻譯，則生成對(duì)應(yīng)公司的語(yǔ)言文件，且新生成的文件中，只有要覆蓋的內(nèi)容，如下：

????代碼實(shí)現(xiàn)部分

?安裝模塊

????根據(jù)你的需求選擇：

1. 在Src下的assets中創(chuàng)建locales存放多語(yǔ)言文件(打包時(shí)會(huì)被壓縮到項(xiàng)目里，沒有單獨(dú)的文件)

2. 在public下創(chuàng)建locales存放多語(yǔ)言文件(打包后文件保留，不會(huì)被壓縮)

????多語(yǔ)言文件可使用.JSON或.JS，區(qū)別如下圖

????然后再main.js或main.ts里添加引用，把插件裝載到Vue里，如果文件在src下，最好使用@配置引用地址

????切換語(yǔ)言直接修改locale值即可：

動(dòng)態(tài)加載

在執(zhí)行完后臺(tái)接口取到了文件名后，把文件引入到項(xiàng)目，并賦值給I18N