react intl

react-intl 实现 React 国际化多语言

喜你入骨 提交于 2020-04-24 17:10:35
效果预览 React Intl 国际化步骤 创建国际化资源文件 根据语言获取国际化资源 引入 react-intl 的 local data 创建 LocaleProvider 国际化上下文组件 创建 react-intl 国际化上下文组件 使用 react-intl's components & apis,进行国际化开发 1. 创建国际化资源文件 目前我们管理资源文件的方式是在 src/locales 文件夹下: . ├── en-US.js ├── en-US.messages.js ├── zh-Hans.js └── zh-Hans.messages.js *.messages.js 是我们的资源文件(这里我们采用了 js 格式,你也可以使用 json 等等),返回的是一个对象,key 为我们翻译用的 id,value 为具体语言的翻译,内容是: export default { 'page.localeProvider.react' : '{ name }, a JavaScript library for building user interfaces.' , 'page.localeProvider.react.html' : '<p>{ name } makes it painless to create interactive UIs. Design