前端國(guó)際化JS庫(kù)i18n配置使用方法
下載 JS 國(guó)際化庫(kù)
pnpm install i18next cnpm install i18next npm install i18next yarn install i18next
在跟組件創(chuàng)建語(yǔ)言文件并建立 i18n.ts （ 任意名字都可 ）
import i18n from "i18next";
import { initReactI18next } from "react-i18next";
import { englisth } from "./Englisth";
import { japanese } from "./Japanese";
import { thaiLanguage } from "./ThaiLanguage";
i18n.use(initReactI18next).init({
resources: {
en_US: {
translation: { ...englisth },
},
ja_JP: {
translation: { ...japanese },
},
th_TH: {
translation: { ...thaiLanguage },
},
},
lng: "en_US",
fallbackLng: "en_US",
// lng: "zh-CN",
// fallbackLng: "zh-CN",
interpolation: {
escapeValue: false,
},
});
export default i18n;
// import i18n from "@/Language/i18n";
lng 屬性表示你選擇的哪種語(yǔ)言，fallbacklng 屬性表示你的備選語(yǔ)言（ 在主選語(yǔ)言查詢不到的時(shí)候，會(huì)在 fallbacklng 中進(jìn)行查找 ）
resources 中的每個(gè)對(duì)象代表的是一種語(yǔ)言，需要自定義，我此處是將語(yǔ)言單獨(dú)創(chuàng)建文件進(jìn)行引入。
示例：
接下來(lái)使用直接引入此文件，調(diào)用 .t() 方法即可使用，示例如下：
import i18n from "@/Language/i18n";
{
label: i18n.t("退出登錄"),
key: "loginExit",
},由于我默認(rèn)選擇的語(yǔ)言是 en_US ，所以此處的退出登錄在頁(yè)面上就會(huì)被翻譯成 Log Out。
總結(jié)
到此這篇關(guān)于前端國(guó)際化JS庫(kù)i18n的文章就介紹到這了,更多相關(guān)前端國(guó)際化JS庫(kù)i18n內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了JS+CSS3實(shí)現(xiàn)超炫的散列畫廊特效，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-07-07
JS樹形菜單組件Bootstrap TreeView使用方法詳解
這篇文章主要為大家詳細(xì)介紹了js組件Bootstrap TreeView使用方法，本文一部分針對(duì)于bootstrap的treeview的實(shí)踐，另一部分是介紹自己寫的樹形菜單，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-12-12
原生JS實(shí)現(xiàn)圖片懶加載(lazyload)實(shí)例
圖片懶加載也是比較常見的一種性能優(yōu)化的方法，本篇文章主要介紹了原生JS實(shí)現(xiàn)圖片懶加載(lazyload)實(shí)例，這里整理了詳細(xì)的代碼,有需要的小伙伴可以參考下2017-06-06
JavaScript實(shí)現(xiàn)拖拽網(wǎng)頁(yè)內(nèi)元素的方法
這篇文章主要介紹了JavaScript實(shí)現(xiàn)拖拽網(wǎng)頁(yè)內(nèi)元素的方法,以注釋形式較為詳細(xì)的分析了javascript事件監(jiān)聽、元素定位的相關(guān)技巧,并配有詳細(xì)的注釋以便于理解,需要的朋友可以參考下2015-04-04
基于Css3和JQuery實(shí)現(xiàn)打字機(jī)效果
最近做項(xiàng)目，有需求實(shí)現(xiàn)一個(gè)字符逐個(gè)出現(xiàn)，類似于打字機(jī)效果，于是上網(wǎng)搜了相關(guān)資料，接下來(lái)，小編就給大家詳細(xì)介紹基于Css3和JQuery實(shí)現(xiàn)打字機(jī)效果，需要的朋友可以參考下2015-08-08
使用?JavaScript?Promise?讀取?Github?用戶數(shù)據(jù)
這篇文章主要介紹了使用JavaScript?Promise讀取Github用戶數(shù)據(jù)，文章圍繞主題展開詳細(xì)的內(nèi)容介紹，具有一定的參考價(jià)值，需要的小伙伴可以參考一下2022-08-08
javascript使用canvas實(shí)現(xiàn)餅狀圖效果
這篇文章主要為大家詳細(xì)介紹了javascript使用canvas實(shí)現(xiàn)餅狀圖效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-09-09
本文通過實(shí)例代碼給大家介紹了bootstrap導(dǎo)航條效果，代碼簡(jiǎn)單易懂，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的的朋友參考下吧2017-05-05
本篇文章主要介紹了js中定時(shí)器的使用方法。需要的朋友可以過來(lái)參考下，希望對(duì)大家有所幫助2014-01-01
微信登錄過程、openId、token詳解(代碼實(shí)現(xiàn))
這篇文章主要介紹了微信登錄過程、openId、token詳解,本文通過示例代碼給大家介紹的非常詳細(xì),感興趣的朋友跟隨小編一起看看吧2024-08-08