i18next国际化语言的使用_韩语自定义国际化文件-程序员宅基地

技术标签: i18next  react  

安装

npm install react-i18next i18next --save

创建文件夹与文件
在这里插入图片描述
以下只展示了三个文件的语言例子
中文(zh_CN.json):

{
    
		"text":"测试",
		"day":"天"
}

白俄罗斯(be_BY.json):

{
     
	"text":"Праверка",
	"day":"дзень"
}

韩语(ko_KR.json):

{
    
	"text":"테스트 하 다.",
	"day":"하늘."
}

引入
在src目录下创建i18n.ts(项目是react+typescript来写的)
npm安装一下 i18next-browser-languagedetector
然后下面是这个文件的所有结构

import LanguageDetector from 'i18next-browser-languagedetector';
import i18n from 'i18next';
import en_US from './locales/en_US.json';
import zh_CN from './locales/zh_CN.json';
import ko_KR from './locales/ko_KR.json';
import ja_JP from './locales/ja_JP.json';
import be_BY from './locales/be_BY.json';

import {
    initReactI18next} from 'react-i18next';

let lang = localStorage.getItem("language");
if (!lang) {
    
    lang = 'zh_CN';
    localStorage.setItem("language", 'zh_CN');
}
i18n
    .use(LanguageDetector)
    .use(initReactI18next)
    .init({
    
        resources: {
    
            en_US: {
    
                translation: en_US,
            },
            zh_CN: {
    
                translation: zh_CN,
            },
            ko_KR: {
    
                translation: ko_KR,
            },
            ja_JP: {
    
                translation: ja_JP,
            },
            be_BY: {
    
                translation: be_BY,
            },
        },
        fallbackLng: lang,
        debug: false,
        interpolation: {
    
            escapeValue: false,
        },
    });

export default i18n;

使用
在要使用的文件里使用

import i18n from './i18n'
<div>{
    i18n.t("day")}</div>  //天
<button onClick={
    ()=>alert(i18n.t("text"))}>测试一下</button>
//如果要切换其他语言,需要去设置更改
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/z321616764/article/details/108640099

智能推荐

构造函数、析构函数与虚函数的三连问_虚拟构造函数不知道具体类型信息-程序员宅基地

文章浏览阅读153次。最近在温习C++,想到了这个问题,查找了一些资料之后描述如下1.构造函数能不能是虚函数?(1)答案:不能,并且在编译器上写时后都会报错,就像下面这样。(2)原因:这是一个来自2002就很火的问题,结合《程序员面试宝典》与知乎用户左轻侯的回答来说,就是:虚函数采用一种虚调用的方法,这是一种可以在只有部分信息的情况下工作的机制,特别允许我们调用一个只知道接口而不知道其准确对象类型的函数。..._虚拟构造函数不知道具体类型信息

网络编程—Linux多线程与多进程_linux多线程,多进程及信号量和进程间-程序员宅基地

文章浏览阅读260次。进程同步与互斥的区别? 进程的同步方式有哪些? 进程的通信方式有哪些? 进程同步与通信的区别是什么? 线程的同步/通信与进程的同步/通信有区别吗?二、多线程的同步与互斥(互斥锁、条件变量、读写锁、自旋锁、信号量)  1、同步与互斥的概念  2、互斥锁(同步)  3、条件变量(同步)  4、读写锁(同步)  5、自旋锁(同步)  6、信号量(同步与互斥)C/C++Linux后台服务器开发高级架构师免费学习地址:C/C++Linux服务器开发高级架构师/Linux后台架构师_linux多线程,多进程及信号量和进程间

【转】模拟器中运行编译好的Android -程序员宅基地

文章浏览阅读190次。编译SDK编译SDK可以得到与源码同步的SDK,还会生成一些tools,在源码根目录下:[plain] view plaincopy$ sudo make PRODUCT-sdk-sdk 编译生成的SDK在out/host/linux-x86/SDK下。之后如果在ubuntu下使用eclipse进行开发,可以使用你编译的SDK。下面就在模拟器中..._emulator.exe -avd 运行安卓编译出来的镜像

PyTorch-LSTM时间序列预测中如何预测真正的未来值_lstm训练好的模型怎么预测-程序员宅基地

文章浏览阅读1.2w次,点赞28次,收藏142次。PyTorch-LSTM时间序列预测中如何预测真正的未来值_lstm训练好的模型怎么预测

同城到家预约上门服务v3.9.1 家政 维修_探花泡家政-程序员宅基地

文章浏览阅读306次。修复了几处BUG。_探花泡家政

机器学习笔试面试题——day2_影响聚类算法结果的主要因素-程序员宅基地

文章浏览阅读4k次。选择题1、以下不属于影响聚类算法结果的主要因素有()A 已知类别的样本质量B 分类准则C 特征选取D 模式相似性测度聚类不知道类别2、模式识别中,不属于马式距离较之于欧式距离的优点的是( )A 平移不变性B 尺度不变性C 考虑了模式的分布缺点1)马氏距离的计算是建立在总体样本的基础上的,即同样的样本在不同的总体中距离是不一样的2)要求协方差逆矩阵必须存在(总体样..._影响聚类算法结果的主要因素

随便推点

图解&代码实现:单向链表的创建(直接添加到链表的尾部,不考虑排序)_添加到链表尾部-程序员宅基地

文章浏览阅读436次。链表的基本介绍链表是有序列表,链表的英文是LinkedList链表的特点:链表是以结点方式来存储的,链表是链式存储链表中的每个结点都分data域和next域data域 : 用来存放数据next域:用来指向下一个结点下面展示的是 链表再内存中的实际结构的布局图:链表的各个结点不一定是连续存储的链表分为带头结点的链表和不带头结点的链表,具体要不要带头结点,根据自..._添加到链表尾部

前端工程师面试题详解(二)_position: fixed导致图片无法铺满-程序员宅基地

文章浏览阅读1.8k次。前端工程师面试题详解(二)_position: fixed导致图片无法铺满

电商运营经理:快速批量导出ASIN,提高效率_亚马逊导出asin-程序员宅基地

文章浏览阅读201次。作为一名电商运营经理,我亲自体验了批量采集ASIN导出的过程,通过这种方法,我成功地获取了大量宝贵的产品信息,并提高了业务效率。1.发现需求:在日常工作中,我发现了一个问题:我们需要快速获取大量产品的ASIN(亚马逊标准识别号),以便进行后续的市场分析和竞争研究。_亚马逊导出asin

python自动生成ppt报告_把时间还给洞察,且看PPT调研报告自动生成攻略-程序员宅基地

文章浏览阅读179次。文/JSong @2017.02.28在数据分析里面有一句话是说,80%的时间要用于数据清洗和整理,而我觉得理想的状态应该是把更多的把时间花在数据背后的洞察当中。去年11月在简书占了个坑,说要自己写一个工具来解决,今天我来填坑了。1、解决方案概述项目地址:github,欢迎star 或者folk软件依赖:python3(兼容python2,但中文部分需要手动修改一个第三方包的2行代码)数据需求:..._根据问卷答案 自动生成ppt报告

Matlab与单片机的串口通信_matlab和单片机进行串口通信-程序员宅基地

文章浏览阅读438次。在本文中,我们将探讨如何使用Matlab与单片机进行串口通信。Matlab是一种功能强大的数值计算和数据分析工具,它提供了丰富的串口通信功能,使我们能够轻松地与单片机进行数据交互。通过配置串口参数、打开串口连接、发送和接收数据,我们可以轻松地与单片机进行数据交互。首先,我们需要将USB串口转换器连接到计算机的USB接口上,并将串口转换器的串口连接到单片机开发板上的串口引脚(通常是TX和RX引脚)。这样,我们就成功地完成了Matlab与单片机的串口通信。请根据你的实际情况修改代码中的串口端口号和参数。_matlab和单片机进行串口通信

Java 转换EXCEL Duble格式时间为指定格式日期字符串_java excel 日期double-程序员宅基地

文章浏览阅读1k次。不需要依赖其他工具,实现Excel数字日期转换为指定格式的日期字符串_java excel 日期double

推荐文章

热门文章

相关标签