i18n呼叫自己引數 I18N的前後端實現

2021-10-12 14:58:15 字數 2795 閱讀 4362

所需工具:

1、vue                

2、vue-i18n      

前期設定

1、構建兩個json語言字典,如果就中英文切換就分別構建 string_en.json 和string_zh.json,格式如下:

2、讀取前一步驟建立的字典,並構造vuei18n元素

//獲取本地語言包

//非同步獲取會沒有response,需要暫時關閉非同步

$.ajaxsettings.async = false;var dictions =);

language= "zh";

}else

ps:2/3步驟中構造的vm和i18n都需要設定為全域性變數,這樣子後續js檔案可以使用到

4、設定語言切換方法

i18n.locale = (i18n.locale == "en" ? "zh" : "en");

$.cookie(parameter.language, i18n.locale, );

location.reload();

通過步驟2可以看到,我們語言型別是通過cookie來控制的,那麼我們只需要切換cookie並重新整理頁面即可

頁面構建

頁面構建可以分為以下幾類:

1、靜態內容

如果是頁面靜態內容需要做i18n,這只需要將原本內容替換成以下格式即可

原本頁面:

修改頁面

其中的unite.strip就是我們一開始設定的語言字典中的內容

2、元素屬性

如果我們要修改頁面中的元素屬性,例如placeholder屬性,則需要進行以下修改

原本頁面

修改介面

3、js中使用

如果需要在json中使用,例如alert輸出,則進行以下替換

原本頁面

alert("你好")

修改頁面

alter( i18n.messages[i18n.locale].sweetalert['hello'])

4、bootstrap-table語言

引用以下語言包即可

* bootstrap table chinese translation

* author: zhixin wen*/$(function() {

$.fn.bootstraptable.locales[i18n.locale]={

formatloadingmessage:function() {if (i18n.locale == "zh")return '正在努力地載入資料中,請稍候……';else

return 'loading, please wait...';

formatrecordsperpage:function(pagenumber) {if (i18n.locale == "zh")return '每頁顯示 ' + pagenumber + ' 條記錄';else

return pagenumber + ' rows per page';

formatshowingrows:function(pagefrom, pageto, totalrows) {if (i18n.locale == "zh")return '顯示第 ' + pagefrom + ' 到第 ' + pageto + ' 條記錄,總共 ' + totalrows + ' 條記錄';else

return 'showing ' + pagefrom + ' to ' + pageto + ' of ' + totalrows + ' rows';

formatsearch:function() {if (i18n.locale == "zh")return '搜尋';else

return 'search';

formatnomatches:function() {if (i18n.locale == "zh")return '沒有找到匹配的記錄';else

return 'no matching records found';

formatpaginationswitch:function() {if (i18n.locale == "zh")return '隱藏/顯示分頁';else

return 'hide/show pagination';

formatrefresh:function() {if (i18n.locale == "zh")return '重新整理';else

return 'refresh';

formattoggle:function() {if (i18n.locale == "zh")return '切換';else

return 'toggle';

formatcolumns:function() {if (i18n.locale == "zh")return '列';else

return 'columns';

formatexport:function() {if (i18n.locale == "zh")return '匯出資料';else

return 'export data';

formatclearfilters:function() {if (i18n.locale == "zh")return '清空過濾';else

return 'clear filters';

$.extend($.fn.bootstraptable.defaults, $.fn.bootstraptable.locales[i18n.locale]);

使用要點/常見錯誤

1、vue掛載節點內部不可以有style和scripts標籤

2、vue構造的js和頁面的js引用順序,確保vue的構造js優先呼叫

ps:我想寫.net core

i18n呼叫自己引數 用i18n做國際化go後端

相關 檔案在 internationalization,取開頭和結尾字母,算一下字母數18,組合一下就是i18n,這是乙個約定俗稱的叫法。在其他語言中,做國際化的相關包一般也會以這個名字命名。我這裡使用的是 這個底下的i18n包 安裝過後,在根目錄建乙個i18n的資料夾,新建兩個不同語言的檔案。en...

I18N對應備忘表

中國 簡體中文 簡體中文 中國 zh cn 正體中文 台灣地區 zh tw 正體中文 香港 zh hk 英語 香港 en hk 英語 美國 en us 英語 英國 en gb 英語 全球 en ww 英語 加拿大 en ca 英語 澳大利亞 en au 英語 愛爾蘭 en ie 英語 芬蘭 en f...

Facelets如何進行i18n

如果使用jsp作為jsf的檢視,那麼在每個也沒可以用載入國際化檔案,但是使用faclets如何進行國際化檔案載入呢?我的做法如下 1.在faces config.xml中增加如下配置 zh cn message 2.在 web inf classes 下增加message.properties和me...