介绍
r2i18n 是一个 JavaScript 库,用于国际化(i18n)前端应用程序。它支持从不同数据源中读取翻译、动态更改当前语言、自动翻译文本等功能。
r2i18n 基于 React 和 Redux 构建,但也可以与其他框架和库一起使用。
安装
使用 npm 进行安装:
npm install r2i18n
使用方法
初始化
在应用程序的入口文件中导入 r2i18n 时,需要传入一些参数来初始化:
-- -------------------- ---- ------- ------ ------ ---- --------- ----- ------ - --- -------- ---------------- ----- ------------------- ------ ----- ------ ------------------- -------- ------------- - --- - ------ ------- -------- -- --- - ------ ------- ------- -- --- - ------ --------- -- -------- -- -- ---
这里的参数详细说明如下:
defaultLanguage
:默认语言。如果没有指定当前语言,则会使用默认语言。supportedLanguages
:支持的语言列表。translationsSource
:翻译数据源。支持local
和remote
,分别表示从本地和远程获取翻译数据。translations
:翻译数据。如果使用本地数据源,则需要传入一个对象,其中每个属性都表示一种语言,对应的值是一个包含所有翻译文本的对象。如果使用远程数据源,则需要传入一个 URL,该 URL 返回一个包含所有翻译文本的对象。
获取翻译文本
要获取翻译文本,只需使用 getText
方法:
const text = r2i18n.getText('hello');
如果当前的语言是英语,则返回的结果是 'Hello, World!'
。
更改当前语言
要更改当前语言,可以使用 setLanguage
方法:
r2i18n.setLanguage('de');
然后再使用 getText
方法获取文本时,返回的是德语翻译文本。
监听语言变化
r2i18n 会在 Redux store 中保存当前语言。可以使用 subscribe
方法监听语言变化:
const unsubscribe = r2i18n.subscribe(() => { console.log('Language changed:', r2i18n.getLanguage()); });
在应用程序的某个位置调用 unsubscribe
,取消监听。
自动翻译文本
r2i18n 还支持自动翻译文本,即在浏览器中检测用户的语言,并尝试自动翻译文本。
const autoTranslate = true; const text = r2i18n.getText('hello', autoTranslate);
如果当前浏览器的语言是德语,则返回的结果是 'Hallo, Welt!'
。
示例
下面是一个完整的示例:
-- -------------------- ---- ------- ------ ------ ---- --------- ----- ------ - --- -------- ---------------- ----- ------------------- ------ ----- ------ ------------------- -------- ------------- - --- - ------ ------- -------- -- --- - ------ ------- ------- -- --- - ------ --------- -- -------- -- -- --- ----- ---- - ------------------------ ------------------ -- ---------- ------- ------------------------- ------------------------------------- -- ---------- ------ ----- ----------- - ------------------- -- - --------------------- ---------- ---------------------- --- ------------------------- -- ------------ -------- --- ----------------------------------- ------- -- ------------ -- -------
总结
r2i18n 是一个方便的国际化库,支持配置文件,自动翻译和语言变化监听等功能。如果你需要在前端应用程序中实现 i18n,r2i18n 可以提供很好的帮助。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/600566b481e8991b448e3004