问题标签 [react-i18next]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
2924 浏览

reactjs - 无法通过 FETCH 后端获取 react-i18next 来读取 JSON 文件

我正在尝试react-i18next在客户端上使用i18next-fetch-backend,即使我可以通过浏览器访问 JSON 翻译文件,但在init例行程序中处理它们的方式有些混乱。

作为记录,我将create-react-app用作前端 React 应用程序的基础,如果这有所不同,到目前为止,我所有的测试都在 localhost 中(使用 localhost:3000 上的 React 应用程序和“服务器”在本地主机上:8000)。

这是我的初始化文件:

...然后包装我的应用程序的组件如下所示:

...最后,应该进行翻译的组件:

如果我在加载页面时查看 Chrome 调试器,我会看到以下内容: 铬控制台

执行两个 FETCH 命令:一个 forcommon.json和一个 for app.json。在我看来,看起来这两个 FETCH 命令都正确执行,但是在初始化配置数据中根本没有数据进入该parse()函数。backend

事实上,如果我跳到 Chrome 网络选项卡,浏览器肯定会认为数据已从服务器正确返回到浏览器:

Chrome 网络标签

所以我对发生了什么感到困惑。我已经仔细研究了 i18next 文档和几个示例,但到目前为止都是空的。任何帮助表示赞赏。

谢谢!

0 投票
3 回答
29837 浏览

javascript - react-intl vs react-i18next 用于 ReactJS 国际化(i18n)

我需要使用 ReactJS 构建一个多语言应用程序。该应用程序需要针对不同语言的自定义字典以及日期/时间、数字和货币的自动格式化。

从我所见,有 2 个非常受欢迎的库:

react -intlreact-i18next

一个和另一个之间有什么优势?什么是最受支持和最受欢迎的?

支持多种语言的 ReactJS 应用程序的一般选择是什么?

0 投票
4 回答
23850 浏览

javascript - react-i18next:在文本中间插入 HTML 标签中的链接

我正在使用 react、i18nextreact-i18next。我想在文本中间插入一些带有 HTML 链接的可翻译文本,这些文本在反应中插值,如下所示:

下面的解决方案有效,但问题是我需要在反应中插入链接,因此不能在标签文件中硬编码:

这似乎好多了:

可能是解决方案,但是该应用程序被翻译成多种语言,翻译质量确实很重要,所以我更喜欢将整个文本放在一行中供翻译人员使用(这对于有案例的语言尤其重要)。

有没有办法让这样的事情开始工作(或者有什么方法可以完全不同地解决它)?

0 投票
2 回答
8536 浏览

reactjs - react-i18next 未在使用 create-react-app 创建的 React 应用程序中加载 json 翻译文件

我用create-react-app创建了一个 React 应用程序

我想实现翻译,我发现了react-i18next

安装所需的软件包后,我设置了 i18n.js 配置文件:

我收到此错误:i18next::backendConnector: loading namespace translation for language en failed failed parsing locales/en/translation.json to json

发生这种情况是因为 webpack 没有找到 json 文件,而是返回 index.html 文件内容:

在此处输入图像描述

0 投票
1 回答
987 浏览

react-native - 用于 i18next 的 React-native 后端

我如何在 RN 中加载翻译 json 文件?在浏览器中我可以使用fetch 和 XHR,但在应用程序中它必须是某种文件系统访问权限,并将翻译复制到 ./android/app/src/main/assets/ 文件夹?

0 投票
4 回答
23061 浏览

reactjs - 我如何开玩笑地模拟 react-i18next 和 i18n.js?

包.json

i18n.js

i18nextMock.js

由于某种原因,开玩笑的单元测试没有得到组件。

这是一个单元测试:

0 投票
1 回答
389 浏览

reactjs - 反应 JS i18n 语言环境

我在我的 reactJS 应用程序中使用 react-i18next

是这样的可能:

嵌套/分组语言环境

并像这样打印它们:

问题是不是翻译是 printet ...我的关键 application.dashboard 已打印...

谢谢。

更新:

这不起作用:

0 投票
1 回答
5671 浏览

javascript - 使用 in 函数反应 JS i18n

我有很多这样的功能:

但在这里我得到了一个错误。-> t 不是函数..

因为这是缺失的:

如何将 translate('translations') 部分添加到函数中?

谢谢

0 投票
2 回答
5032 浏览

javascript - reactJS i18n 重新加载页面

我在我的 reactjs 应用程序中使用 react-i18next。

问题是当我更改应用程序重新加载的语言并始终从主路线开始时。

有没有办法在同一页面上重定向或更改语言而不重新加载页面?

谢谢

更新

I18n.js

改变语言:

0 投票
1 回答
1759 浏览

internationalization - react-i18next 无法解析密钥

我对 react-i18next 无法解析我的密钥有问题,所以我得到的所有输出都是密钥本身。

我不得不将我的项目作为 gui 项目嵌入到 VisualStudio 解决方案中。运行我的原始项目效果很好,相比之下,解决方案项目无法解决我的翻译函数调用的关键部分。

我的 i18n.config 看起来像这样:

将项目嵌入解决方案时,我不得不更改 webpacks 输出文件夹,我认为这是发生故障的实际原因,但我找不到问题发生的确切位置。我尝试更改 loadPath,但如果那是失败的根源,我只是没有以正确的方式尝试:S

我的项目树如下所示:

在我的旧项目中,webpack 输出是 '/dist/',与 src 处于同一级别,在解决方案中,'../out/prgFiles/html'。

admin.json 现在根本不包含任何键,user.json 包含键,就像您期望的那样:

如前所述,我尝试了一些路径更改,检查了翻译,找到了 i18next 和 i18next-Provider,一切都很好。它只是无法将 KEY_CONSTANT 解析为实际值。

你知道问题可能是什么吗?