问题标签 [react-i18next]

我正在尝试使用react-i18next库。

将功能放入组件的通常方法t是使用 HOC 装饰它，translate如docs中所述。

但无论如何，您必须像这样创建 i18n 的实例。

我可以将此实例导入我的组件import i18n from './i18n'，然后使用t这样的功能i18n.t('namespace:key')

在这种方法中，我不需要 HOC。有没有可能出现的陷阱？

我正在尝试将 react-i18next 与 Typescript 一起使用，但遇到了一些问题。

这是我期待的道具的界面。

然后我有一个导航组件，由我编写。

现在我只想渲染这个我已经组成的组件

但是，在这个时刻，TS 失败了，我收到以下错误

有人可以解释我做错了什么。

我的_nav.js文件：

我的组件：

问题是我在更改语言时没有翻译我的文本。我的浏览器需要刷新才能应用翻译。有人知道如何在不刷新页面的情况下完成翻译吗？

编辑：这是我的翻译服务：

我还将更改语言按钮放在页面的 Header 组件上。

目前与我合作的客户要求我构建一个包含 i18n 的 SSR React 应用程序。为了解决这个问题，我尝试使用 NextJS 和 i18Next。

我设法让反应和阿波罗毫无问题地连接起来，但是当我尝试连接下一个 + i18n 时，我一直收到一个非常无用的“意外错误”，错误。

检查控制台我还看到以下内容：

还有这个警告，但我不确定它是否相关

我还注意到在 ./libs/withData.js 中有以下行：

enter code here静态显示名称 =WithData(${getComponentDisplayName( ComposedComponent )})

我的编辑器将其标记为无效令牌，但此代码来自nextjs 示例，并且该 repo 上没有问题，这表明这是一个错字。

我已在以下 codepen 项目中包含与此问题相关的所有代码。

https://codepen.io/foxleigh81/project/editor/DnYJWB

我的应用看起来像这样

在子组件中也有翻译字符串的正确方法是什么？如果我想根据使用的语言呈现“Page not found”或“Pagina non trovata”，我的 NotFound 组件是

我必须做什么才能使用

我有带有组件的仓库和带有主应用程序的仓库。我在 repo 中使用组件实现了 i18next，当我在这个 repo 中有一个 i18n 配置文件时（或者当我通过 app repo 中的 props 传递它时）它工作正常。但是当我尝试从主应用程序仅发送“资源​​”部分并将其替换为组件的配置文件时，我遇到了问题。我试图克隆 i18n 实例并设置资源，但它不起作用。这是我的配置文件：i18n.js

resources.js 文件（我在开始时尝试使用资源键，但它仍然不起作用）：

现在我尝试了这样的事情：

当我通过带有资源的道具传递 i18n.js 时，它运行良好，但我想从主应用程序中删除 i18next 并将其仅保留在组件中。问候

我使用 i18next 在单独的仓库中翻译我的组件。现在我需要在我的主项目中使用一个组件中的方法。这是示例组件：

现在我需要在我的主项目中使用resetText，没有翻译它工作正常

我试过 this.refs.exampleComponent.resetText(); 但它不起作用。在 i18next 文档中，我发现“withRef | 将引用存储到包装的组件并通过 decoratedComponent.getWrappedInstance(); 访问它” 但是我应该在哪里使用这个 getWrappedInstance() 让它工作？有人有这方面的经验吗？

问候

我发现这篇简单的文章https://medium.com/@jamuhl/translate-your-expo-io-react-native-mobile-application-aa220b2362d2在 RN 中实现本地化（在 Expo 中）。

我的用例有点不同：我的应用程序有数百个要翻译的术语列表（每种语言约 1MB 的 js 对象，乘以 6-7 种语言）。

该应用程序完全脱机（没有机会从服务器加载语言环境文件），所以我正在寻找延迟加载我想要的 json/js 语言环境对象的最佳方法。

我来这里可能是为了听取 RN/i18next 专家的建议。

编辑： 我几乎复制了这个https://github.com/i18next/react-i18next/blob/master/example/react-native-expo/js/i18n.js的 i18n 配置

真正的数据库在现场data:DB。Obiouvsly 这不是加载繁重文件的最佳方式，我总是加载所有语言的所有数据库..我可以保持相同的简单结构，但延迟加载我需要的语言吗？否则，在 i18next 和 react-native 中有本地延迟加载（来自设备文件系统）的示例吗？

有一种方法可以迭代和渲染字符串/对象数组的每个项目？

在组件中：

我有与这里描述的相同的问题（堆栈溢出问题），除了我的两个项目都配置正确。

我的 i18n.js 配置设置如下。

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

我确保我的locales目录在我的public目录中。我还验证了 postnpm run build目录locales是否已复制到build目录中。

在我的暂存环境中，我打开 Chrome 开发工具上的网络选项卡并translations.json在新选项卡中打开。我被带到正确的 urlhttps://example.com/locales/en/translation.json但是我被重定向到我的 index.html