React Native多语言
https://www.jianshu.com/p/4dc5612854eb
可以用react-native-i18n
执行命令安装:
npm i react-native-i18n --save
在js目录下新建多语言文件,比如说需要支持英文和中文,那么就建两个文件en.js和zh.js
文件内容为:
en.js
export default {
welcome:{
welcome:"welcome to Beijing"
}
}
zh.js
export default {
welcome:{
welcome:"欢迎来到北京"
}
}
然后建一个国际化文件,比如叫 i18n.js
i18n.js
import I18n from 'react-native-i18n';
import en from './en';//en为en.js的路径
import zh from './zh';
I18n.defaultLocale = 'zh'; //设置默认的语言
I18n.fallback = true; //设置
I18n.locale = 'zh'; //设置当前的语言
I18n.translations = { //支持的语言列表
en,
zh
};
export function strings(name, params = {}) {//params默认为json类型
return I18n.t(name, params);
}
export function setLanguage(lan) {
I18n.locale = lan;
}
export default I18n;
然后在其他js文件中,如下引用:
import {strings,setLanguage} from './i18n';//i18n.js文件的位置
<Text>{strings('welcome.welcome')}<Text>//如果是中文输出就会是“欢迎来到北京”
在这里调用 setLanguage('en')就会切换语言到英文,不过在当前页面的话需要调用this.setState刷新一下当前页面。
React Native多语言的更多相关文章
- [转]React Native 语言基础之ES6
React Native 是基于 React 这个前端框架来构建native app的架构.React Native基于ES6(即ECMAScript2015)语言进行开发的. JS的组成 1) 核心 ...
- windows 7下React Native环境配置
React Native 是 Facebook 推出的一个用 Java 语言就能同时编写 ios,android,以及后台的一项技术,它可以做到实时热更新 .FaceBook 也号称这们技术是 “Le ...
- React Native:使用 JavaScript 构建原生应用
[转载] 本篇为联合翻译,译者:寸志,范洪春,kmokidd,姜天意 数月前,Facebook 对外宣布了正在开发的 React Native 框架,这个框架允许你使用 JavaScript 开发原生 ...
- 配置React Native环境
一. 安装Homebrew: “Homebrew installs the stuff you need that Apple didn’t.——Homebrew OS X 更完整”. Homebr ...
- React Native Changed the World? or Nothing.
RN是一个awesome的技术, facebook很有想法的团队创造出一项新的技术改变了native开发界. 但是RN本身又疑点重重, RN是为了解决什么问题而存在的? 在诞生了一年后, RN又解决了 ...
- 30天React Native从零到IOS/Android双平台发布总结
前言 本人有近十年的技术背景,除了APP开发之外对后端.前端等都比较熟悉,近期做一个APP项目需要IOS.Android两个平台都需要,只能硬着头皮上.其实很早就想开发APP也很早就接触Android ...
- React Native开发入门
目录: 一.前言 二.什么是React Native 三.开发环境搭建 四.预备知识 五.最简单的React Native小程序 六.总结 七.参考资料 一.前言 虽然只是简单的了解了一下Reac ...
- React Native 开发之 (01) 配置开发环境
一 React Native React Native 是由Facebook发布的开源框架,着力于提高多平台开发的开发效率 —— 仅需学习一次,编写任何平台.(Learn once, write an ...
- React Native 学习-01
React Native 学习 (学习版本 0.39) 一.环境配置 二.IDE选择 webstorm 1.webstorm配置 ①.首先是可以选择使用汉化包汉化.eu68 ②.安装插件和外部库. 由 ...
随机推荐
- 【ZZ】详解哈希表的查找
详解哈希表的查找 https://mp.weixin.qq.com/s/j2j9gS62L-mmOH4p89OTKQ 详解哈希表的查找 2018-03-01 算法与数据结构 来自:静默虚空 http: ...
- [UE4]缓存选项 Is volatile
volatile:易变的,不稳定的; (液体或油) 易挥发的; 爆炸性的; 快活的,轻快的; UI中的Is Volatile选项:意思当前控件是容易变化的. 这个是一个性能上的优化. 默认情况下UI都 ...
- [UE4]使用材质将图片变成黑白
拖动到材质界面不放,会自动切换到材质界面: 拖放到视图窗口,放开鼠标,就会自动生成一个“Texture Sample”节点 图片材质使用方法跟直接使用图片素材一样:
- 安装npm报错 npm cache clean --force 搞定
- mac一些设置
Mac自带了的JDK6,安装在目录:/System/Library/Java/JavaVirtualMachines/1.6.0.jdk/下. JDK8则需要自己到Oracle官网下载安装对应的版本. ...
- 有关于Integer的一些小问题
先看一小段源码: Integer a1=; Integer a2=; Integer b1=); Integer b2=); Integer c1=; Integer c2=; System.out. ...
- 获取Android文件路径
Environment.getDataDirectory().getPath() : /data Environment.getDownloadCacheDirectory().getPath() : ...
- java synchronized 同步详解
记下来,很重要. Java语言的关键字,当它用来修饰一个方法或者一个代码块的时候,能够保证在同一时刻最多只有一个线程执行该段代码. 一.当两个并发线程访问同一个对象object中的这个synchron ...
- tp5生成小程序推广二维码
//获取用户经销商信息 及生成推广二维码 public function qrcode() { //拿到openid 查找用户表内是否有该用户 没有则拒绝生成二维码 有则查看是否已生成二维码 有生成则 ...
- ECharts学习记录
一.ECharts在GitHub的地址以及需要引入文件地址: 1.Github地址:https://github.com/ecomfe/echarts 2.官网下载文件地址:http://echart ...