国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

基于js的APP多語(yǔ)言處理

lakeside / 3478人閱讀

摘要：本期分享一個(gè)的多語(yǔ)言處理插件，此插件是基于修改而來(lái)的。實(shí)現(xiàn)的原理就是在本地放置一個(gè)或多個(gè)語(yǔ)言資源文件，然后通過(guò)加載這些資源文件并反序列化成對(duì)象，再根據(jù)資源文件中定義的鍵名去替換頁(yè)面中需要顯示的地方。

本文出自APICloud官方論壇，
感謝論壇版主哼哼哈兮 的分享。

本期分享一個(gè)js的多語(yǔ)言處理插件i18n.js，此插件是基于JQuery.i18n.properties修改而來(lái)的。?

實(shí)現(xiàn)的原理就是在本地放置一個(gè)或多個(gè)語(yǔ)言資源文件，然后通過(guò)js加載這些資源文件并反序列化成json對(duì)象，再根據(jù)資源文件中定義的鍵名去替換頁(yè)面中需要顯示的地方。?
再說(shuō)說(shuō)用法：?1、在頁(yè)面中引入i18n.js，加載后會(huì)給window對(duì)象增加一個(gè)名叫 i18n 的屬性，是個(gè)對(duì)象。?2、加載資源文件
?
i18n.init({
?name:?name,?//?資源文件名稱，默認(rèn)為L(zhǎng)ayout
?language:?lang,?//?語(yǔ)言名稱，格式規(guī)范為：{語(yǔ)言}_{區(qū)域}或{語(yǔ)言}，如zh_CN,zh,en,en_US
?path:?"widget://res/lang/",?//?資源文件路徑，默認(rèn)值為：widget://res/lang/5. ???? mode:?"map", //?加載的語(yǔ)言資源是以何種形式返回，js 對(duì)象變量或map，默認(rèn)值：vars
?debug:?api.debug,??//?是否開啟調(diào)試模式
?callback:?fnComplete?//?資源文件加載后的回調(diào)函數(shù)
?});
復(fù)制代碼

3、資源文件加載完成后，會(huì)在 i18n.localize 對(duì)象中得到加載結(jié)果。如資源文件名為默認(rèn)的Layout，則會(huì)得到 i18n.localize.Layout這個(gè)對(duì)象，它是一個(gè)包含資源文件中所有鍵值對(duì)信息的對(duì)象，屬性名為資源文件中的鍵名，屬性值為資源文件中的鍵值。
4、資源文件名稱為 xxx.res, 如Layout.res, Layout_zh.res或Layout_zh_CN.res
??內(nèi)容格式如：

#這里是注釋內(nèi)容，i18n.init執(zhí)行加載時(shí)會(huì)忽略
text_1=?某個(gè)中文字符
text_2=還是中文
復(fù)制代碼
想了解更多詳情的可以參看JQuery.i18n.properties 文檔

最后附上一個(gè)相對(duì)完整的處理流程，以供參考，也歡迎有更好的建議提出。??APP啟動(dòng)時(shí)獲取語(yǔ)言偏好設(shè)置：

var lang = api.getPrefs({

        sync: true,
        key: "language"
    });
    if (!lang) {
        // 初次進(jìn)來(lái)選系統(tǒng)語(yǔ)言
        var sysLang = navigator.language.replace("-", "_");
        for (var i = 0; i < App.consts.languages.length; i++) {
            if (App.consts.languages.value === sysLang) {
                lang = App.consts.languages;
                break;
            }
        }
        // 如果系統(tǒng)語(yǔ)言不在支持的語(yǔ)言中，所默認(rèn)置為支持語(yǔ)言的第一個(gè)
        if (!lang) {
            lang = App.consts.languages[0];
        }
        api.setPrefs({
            key: "language",
            value: JSON.stringify(lang)
        });
    } else {
        lang = JSON.parse(lang);

????????}
根據(jù)獲取的語(yǔ)言加載對(duì)應(yīng)的資源文件：
// 加載布局所需語(yǔ)言資源文件

    var layout = App.getLayoutRes();
    if (!layout) {
        App.loadLanguage(lang.value, "Layout", function() {
            App.setLayoutRes(i18n.localize.Layout);
        });

????????}
最后用加載出來(lái)的結(jié)果去替換頁(yè)面中需要根據(jù)語(yǔ)言顯示的地方，不管是用模板引擎也好還是一個(gè)個(gè)去獲取html元素后修改innerTEXT都行：

               

                


            



    // js中利用模板引擎替換顯示內(nèi)容
    $api.html($api.byId("vipFeature"), template("tpl-vip-feature", layout));

如果要替換的內(nèi)容很少，也可以

默認(rèn)顯示內(nèi)容

// js中直接替換html元素的innerTEXT
$api.text($api.byId("btnNext"),?layout.text_1);

至此，這個(gè)插件基本的應(yīng)用應(yīng)該是沒(méi)有什么問(wèn)題了。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/110271.html

相關(guān)文章

  • 基于Vue、vue-i18n實(shí)現(xiàn)國(guó)際化（多語(yǔ)言）

    摘要：在中引入調(diào)用第三方插件新建一個(gè)對(duì)象默認(rèn)語(yǔ)言配置語(yǔ)言選項(xiàng)是一個(gè)配置語(yǔ)言包文件和語(yǔ)言選項(xiàng)的文件，文件內(nèi)容大致如下語(yǔ)言包列表合并語(yǔ)言包是一個(gè)函數(shù)，判斷當(dāng)前設(shè)置的語(yǔ)言類型，如果沒(méi)有設(shè)置語(yǔ)言，則根據(jù)判斷是中文還是非中文，非中文則顯示英語(yǔ)。 vue-i18n官網(wǎng) https://kazupon.github.io/vue... 項(xiàng)目用vue-cli構(gòu)建，用到vue全家桶及webpack、iview...

    smallStone 評(píng)論0 收藏0

  • 如何讓一個(gè)vue項(xiàng)目支持多語(yǔ)言（vue-i18n）

    摘要：引入是一個(gè)插件，主要作用就是讓項(xiàng)目支持國(guó)際化多語(yǔ)言。所以新建一個(gè)文件夾，存放所有跟多語(yǔ)言相關(guān)的代碼。目前包含三個(gè)文件。全局搜索發(fā)現(xiàn)一共有多個(gè)。 這兩天手頭的一個(gè)任務(wù)是給一個(gè)五六年的老項(xiàng)目添加多語(yǔ)言。這個(gè)項(xiàng)目龐大且復(fù)雜，早期是用jQuery實(shí)現(xiàn)的，兩年前引入Vue并逐漸用組件替換了之前的Mustache風(fēng)格模板。要添加多語(yǔ)言，不可避免存在很多文本替換的工作，這么龐雜的一個(gè)項(xiàng)目，怎么才能使...

    wuyumin 評(píng)論0 收藏0

  • vue 國(guó)際化i18n 多語(yǔ)言切換

    摘要：如果對(duì)您有幫助請(qǐng)動(dòng)動(dòng)鼠標(biāo)右下方給我來(lái)個(gè)贊，您的支持是我最大的動(dòng)力。安裝 npm install vue-i18n 新建一個(gè)文件夾 i18n ，內(nèi)新建 en.js zh.js index.js 三個(gè)文件 準(zhǔn)備翻譯信息 en.js export default { home: { helloworld: hello workd ！ } }; zh.js export d...

    tuomao 評(píng)論0 收藏0

  • 記一次開源學(xué)習(xí)--D2Admin 人人企業(yè)版

    摘要：前言上個(gè)月月底開源組開源了使用適配人人企業(yè)版專業(yè)版的前端工程具體詳情見(jiàn)人人企業(yè)版適配發(fā)布。當(dāng)然，也督促自己產(chǎn)出一篇相關(guān)的文章，來(lái)記錄這次有趣的學(xué)習(xí)之旅。 Created by huqi at 2019-5-5 13:01:14 Updated by huqi at 2019-5-20 15:57:37 前言 上個(gè)月月底@D2開源組 開源了使用 D2Admin 適配 人人企業(yè)版(專業(yè)版) 的...

    notebin 評(píng)論0 收藏0

  • React項(xiàng)目國(guó)際化(antd)多語(yǔ)言開發(fā)

    摘要：本國(guó)際化方案僅針對(duì)技術(shù)棧，且不會(huì)涉及服務(wù)端國(guó)際化內(nèi)容。引入多語(yǔ)言環(huán)境的數(shù)據(jù)雖然我只用到了文本翻譯的功能，以為就不需要加載這些數(shù)據(jù)，但后來(lái)發(fā)現(xiàn)這是必須的步驟。 前言 最近新接了一個(gè)項(xiàng)目，從0開始做，需要做多語(yǔ)言的國(guó)際化，今天搞了一下，基本達(dá)到了想要的效果， 在這里簡(jiǎn)單分享下： showImg(https://segmentfault.com/img/bVbuiJB); 背景國(guó)際化方案國(guó)際...

    tracymac7 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<