目前正在进行的项目就是一个多语言切换的项目,有些前情知识我们可以
从https://react.i18next.com/getting-started进行了解。
说到使用方法,当然首先是要$ npm install react-i18next --save,才能够在我们的项目中运用
当然在我们的根目录中需要引入

第一步:先看看运行的效果图

第二步:请先看我的语言转换目录

查看我的语言内容json文件

第三步:我是如何在文件中引用的
1.引入文件

2.转换的语言

3.使用

4.看我的代码


上面的这个其实只是针对的dropdown
那我们针对的要转换的文字是怎么在项目中写的呢?直接是使用函数t进行转换的。

react中多语言切换的实现方式的更多相关文章

  1. react中的ref的3种方式

    2020-03-31 react中的ref的3种方式 react中ref的3种绑定方式 方式1: string类型绑定 类似于vue中的ref绑定方式,可以通过this.refs.绑定的ref的名字获 ...

  2. 关于在静态html中实现语言切换的思路与实现

    在项目中只用到了三种语言:英文.中文简体.中文繁体.所以我首先想到了最笨的方法:1.直接将三种语言写在html中,显示当前设置的语言隐藏其它两种来实现.2.使用css伪元素的content:attr( ...

  3. React中创建组件的3种方式

    目前作者所知道的创建react组件的方式有三种: 函数式定义(无状态组件) function MyComponent(props){ return( <h1>mycomponent< ...

  4. React中组件通信的几种方式

    https://segmentfault.com/a/1190000012361461 需要组件之进行通信的几种情况 父组件向子组件通信 子组件向父组件通信 跨级组件通信 没有嵌套关系组件之间的通信 ...

  5. react-redux --》react中 最好用的状态管理方式

    一.Redux与组件 react-redux是一个第三方插件使我们在react上更方便的来使用redux这个数据架构 React-Redux提供connect方法,用于从UI组件生成容器组件,conn ...

  6. Android app应用多语言切换功能实现

    最近在做一个多语言切换的功能,类似于微信的语言切换,搜了下资料基本上都是以下这种: 1. 实现的效果 和微信类似,在设置界面打开切换语言的界面,选择语言后重启 HomeActivity,语言切换完成, ...

  7. react项目实现多语言切换

    网站的语言切换功能大家都见过不少,一般都是一个下拉框选择语言,如果让我们想一下怎么实现这个功能,我相信大家都是有哥大概思路,一个语言切换的select,将当前的选择的语言存在全局,根据这个语言的key ...

  8. 在SOUI中使用动态多语言切换

    动态语言切换是很多国际化产品的需求,SOUI之前的版本支持静态多语言翻译,通过在程序启动时设置好语言翻译模块,在程序中打开的UI都会自动调用该翻译模块进行文字翻译,但是不支持运行进语言切换. 最近几个 ...

  9. [转] React 中组件间通信的几种方式

    在使用 React 的过程中,不可避免的需要组件间进行消息传递(通信),组件间通信大体有下面几种情况: 父组件向子组件通信 子组件向父组件通信 跨级组件之间通信 非嵌套组件间通信 下面依次说下这几种通 ...

随机推荐

  1. Centos下部署DRBD+NFS+Keepalived高可用环境记录

    使用NFS服务器(比如图片业务),一台为主,一台为备.通常主到备的数据同步是通过rsync来做(可以结合inotify做实时同步).由于NFS服务是存在单点的,出于对业务在线率和数据安全的保障,可以采 ...

  2. Shell学习笔记二

    一.调试脚本 调试功能是每一种编程语言都应该实现的重要特性之一,当出现一些始料未及的情况时,用它来生成脚本运行信息.调试信息可以帮你弄清楚是什么原因使得程序发生崩溃或行为异常.每位系统程序员都应该了解 ...

  3. 网页录像录音功能的实现之MediaRecorder的使用

    前面介绍了通过H5实现在网页内打开摄像头和麦克风,实现截图和图像预览的相关知识. getUserMedia API及HTML5 调用摄像头和麦克风 一个简单的demo  实现摄像头的调用及视频录制,截 ...

  4. Final 个人最终作业。

    1.对软件工程M1/M2做一个总结 在M1阶段,我在C705组.M1阶段我与黄漠源同学结对,一起完成提取关键词算法的优化.最初我们一起测试提取关键词算法功能的实现效果,随后我主要负责从网络上搜寻并整理 ...

  5. 2017-2018-2 1723《程序设计与数据结构》实验四 & 实验五 & 课程总结 总结

    作业地址 实验四作业:https://edu.cnblogs.com/campus/besti/CS-IMIS-1723/homework/1943 提交情况如图: 实验五作业:https://edu ...

  6. input file multiple 批量上传文件

    这几天维护系统,有一个批量上传文件功能,出现了一点小问题 我的笔记本选择要上传的文件很正常 但在测试环境上,别人的电脑上,选择上传文件之后 一开始,以为是代码问题,网上找了很多的资料,但还是没用,然后 ...

  7. 第二次sprint

    一.这次冲刺就是实施阶段了,主要对程序进行一次骨架的构建,基本上已经完成了界面的设计,但是在算法上还有很大漏洞,整个程序还是属于不成熟阶段. 二.这是我们的界面 三.已经有的功能:随机生成题目并算出答 ...

  8. jQuery(五)

    wrap <script> //wrap:包装 //wrapAll:整体包装 //wrapInner:内部包装 //unwrap:删除包装(删除父级,不包括body) $(function ...

  9. log4php的使用方法与详细配置

    log4php的使用 首先引入logger.php文件.log4php可以通过引入logger.php来完成自动加载的过程.文件位置如下: 日志记录器自身没有定义日志的输出目的地和格式,所以我们通常需 ...

  10. PhantomJS - Scriptable Headless Browser

    http://phantomjs.org/ PhantomJS is an optimal solution for: Page automation Access webpages and extr ...