i18next的简单使用

本文介绍了如何在项目中集成i18next进行多语言支持,包括通过npm安装i18next,导入并配置react-i18next、i18next-http-backend和i18next-browser-languagedetector,设置默认语言和debug模式,以及创建和使用语言包。
摘要由CSDN通过智能技术生成

1:npm下载i18next:npm install i18next

2:导入i18next:mport i18n from "i18next"

3:    

        import { initReactI18next } from 'react-i18next';

        import Backend from 'i18next-http-backend';

        import LanguageDetector from 'i18next-browser-languagedetector';

    export i18n

        .use(Backend)                  //标识用户输入语言

        .use(LanguageDetector)  //将i18n实例传递给react-i18next模块

        .use(initReactI18next)      //i18next的实例

         //初始化i18n

        .init({

                fallbackLng: lang,    //默认语言的设置

                lng: lang,                //告诉i18n用户使用的那组语言

                debug: true,           //开启debug模式

                resources: resources,//resources自个创建的语言包

                interpolation: {

                      escapeValue: false,//阻止xss攻击

               }

          });

4:语言包的创建resources

        export resources = {   

            en:{

                translation: en_resources(英文语言包)

            },

            zh:{

                translation: zh_resources(中文语言包)

            }

        }

i18n.changeLanguage('要使用的语言')    改变语言状态

  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值