我有一个名为“选项”的对象数组，我将其用作下拉/选择 Material-UI 组件的道具。我想在标签上使用 next-i18next 库。就像文档解释的那样，我已经通过所有下一个应用程序成功实现了。我尝试使用 {t('key')} 但它不允许。

我正在使用 nextjs 开发一个项目，我使用 next_i18_next 库进行本地化，当我尝试导航到另一条路线时出现未定义的错误。

当我声明一个新页面时，如果我没有声明 getStaticProps 或 getServerSideProps，即使我不使用翻译挂钩，我也会收到此错误。当我尝试转到不存在的路线而不是 404 页面时，我收到此错误。

这是我的 next-i18next.config.js 文件：

这是我的 next.config.js：

我在我的配置中做错了吗？我试图创建一个 404 页面，但我不能在那里声明 getStaticProps 或 getServerSideProps。该库可以工作，但我必须声明 props 函数并为 props 提供命名空间和文件，如下所示：

但是当我尝试导航到不需要翻译或不存在的路线时，我得到了上述错误，在不存在的情况下，我没有得到 404 页面并得到未定义的错误。

我在项目中使用 Next-i18next 包进行本地化。

我成功地在我的 UI 上渲染了翻译后的内容。但是当我尝试使用酶（浅层测试）和 jest-dom 测试我的内容和文本时，测试失败了，因为翻译的内容无法正确呈现。

我尝试了各种解决方案：

• https://react.i18next.com/misc/testing
• 在 JEST 中模拟 i18n 的 useTranslation 不起作用
• 如何在使用 react-testing-library 和 jest 完成的单元测试中启用 react-i18n 翻译文件？
• 我如何开玩笑地模拟 react-i18next 和 i18n.js？
• 我试图用 <I18nextProvider i18n={i18n}> </I18nextProvider>

没有人为我工作。

我的测试文件：form.test.tsx

我从失败的测试中得到这种类型的错误：

TestingLibraryElementError：找不到带有以下文本的标签：名字

因为快照不是“名字”字符串，而是在翻译 json 中呈现“名字”键。

欢迎任何建议和解决方案。

我最近加入了一个新项目，我必须实施 i18n。前端堆栈：NextJS (with Next Auth) + Apollo + next-i18next 我跟着 next-i18next starter 来实现翻译。在我添加零件之前一切正常addWithTranslation，如下面的代码所示：

在_app.tsx

我的问题：每当用户尝试访问另一个页面时，整个应用程序似乎都会重新安装，因此它会重定向到/auth/signin而不是立即到达正确的页面。当我记录会话时，每次用户导航到另一个页面时它似乎都会重置（仅当我添加该appWithTranslation()部分时）。

有谁知道我该如何解决？

一句话总结

当我在await serverSideTranslations里面getStaticProps时，loading来自的价值useSession()仍然停留在true.

语境

我使用next-auth.js(v3) 进行身份验证。我已经（感激地）使用了一年没有问题。

const [session, loading]=useSession()是检查某人是否登录的钩子。

该loading选项表示会话状态正在更新；它是true在获取会话数据并false完成检查时。 https://stackoverflow.com/a/63191786/870121

我正在添加next-i18next到我的项目中。大部分都在工作，但我遇到了一些困难。

我已按照.next-i18next

它适用于具有以下功能的页面getServerSideProps：页面加载，next-authuseSession()仍然有效，并且翻译工作没有警告或错误（示例）。例如，像这样/login使用getServerSideProps：

并且适用于/de/login 和/en/login 或仅适用于 /login 您可能会在这两个页面上的导航栏（桌面上）的左上角短暂地看到“正在加载......”这个词。这出现在loading是真的，但很快就消失了。

问题

当我使用它时遇到了一些困难getStaticProps。具体来说，loading由useSession()res . 返回true。

案例 A：当我在页面级别使用此代码时，翻译工作，但“加载”值 useSession() 仍然为真

注意awaitbefore serverSideTranslationsthere 的使用；这是故意的，正如我见过的所有文档中所建议的那样。

以上导致该行无法按预期工作；loading停留在true...因此我不知道用户是否已登录。

关于 的某些东西await serverSideTranslations导致useSession()总是返回[undefined, true]。

注意：我使用的是 next-auth v3，而不是 v4。

案例B：我可以删除await之前的关键字serverSideTranslations，然后useSession()正常工作……但是翻译不起作用。

有小费吗？

到目前为止我已经尝试过：

我一直专注于尝试适应next-i18next不需要的await关键字。这让我陷入了连续警告/错误的困境，每个都是由先前的修复引起的：

• serverSideTranslations在in之前删除“await” getStaticProps。
• 尝试按照https://stackoverflow.com/a/69311205/870121添加react: { useSuspense: false }到 next-i18next.config.js （没有帮助）。
• 得到错误react-i18next:: You will need to pass in an i18next instance by using initReactI18next。→ 尝试通过添加use: [initReactI18next],来修复next-i18next.config.js。
• 得到错误，“appWithTranslation 调用没有配置”→通过添加到修复_app.js
• 获取诸如“错误：._nextI18Next.userConfig.use[0].init从getStaticProps;返回的错误序列化”之类的错误 → 添加serializeConfig=false到 next-i18next.config.js 并appWithTranslation按照“不可序列化配置”说明将配置传递给。
  但是，没有一个next-i18next文档建议删除该await关键字，因此这感觉像是一场失败的战斗/可能会带来一些意想不到的后果

我想要帮助的：

我可以在通话中留下await之前的关键字，但仍然没有坚持吗？我可以按照这些文档的建议保留我的使用，但是以某种方式修改我的钩子，这样就不会坚持下去吗？我只是在代码中的其他地方遗漏了一些关键字吗？serverSideTranslationsgetStaticPropsloadingtruenext-i18nextnextauthloadingawait

示例代码

比较这两个页面：

• /de/test/no-await → 翻译不起作用。
• /de/test/with-await → 翻译工作，但loading卡住了true，我不知道用户是否登录。

明确一点：我们想loading迅速成为false.

这两个页面具有以下代码。

next.config.js（提炼）：

next-i18next.config.js（全部）：

pages/with-await.jsx（全部）：
见https://awesound-web-iow8f7d1o-awesound.vercel.app/de/test/with-await

pages/no-await.jsx（全部）：
请参阅https://awesound-web-iow8f7d1o-awesound.vercel.app/de/test/no-await
注意它与pages/with-await.jsx但 usesAwait 是错误的

共享组件，

我只是将我的工作应用程序从 react 迁移到 nextjs。我按照 next 提供的教程安装了 next-i18next 但我无法映射

我得到了这种对象

我需要将翻译解析成这个组件

关于我在迁移中错过的任何想法？

我将 Next js 用于商店站点，并且我的站点具有多语言功能。我的问题是如何在包含静态和动态数据的页面上使用 getStaticProps、getServerSideProps？

_app.js

产品页面：

我的动态路由页面 [id] 上有以下代码，我正在尝试将其与 next-i18next 翻译一起使用。但是，在 Vercel 上部署（在本地工作）时会引发错误。我正在尝试使用带有空路径数组的回退函数以某种方式接受所有可能的路径（？）。在我的控制台中，我收到状态码 500 GET 错误和“无法加载静态道具”错误。

当我在其中指定特定 idgetStaticPaths并转到该匹配路径时，它正在工作。但是，我不可能指定数以千计的 id 来使其正常工作。后备不应该解决这个问题，或者我怎样才能克服这个问题？

更新：这是 Vercel 函数日志（xxxxx-values 是我删除的一些 id）

我有个问题”。我想使用这个库next-i18next在我的Next.js Web 应用程序中实现i18n。如果我使用正确的语言环境更改路由，它就可以工作，例如localhost:3000/en --> localhost:3000/it，但是我想获得的结果是在不更改路由的情况下更改语言。基本上我不想将Next.js 的国际化路由功能与i18n的实现一起使用。我是 Next.js 环境中的新手。提前感谢您的回复