【问题标题】:How to pass i18n or t function to dependency using next-i18next如何使用 next-i18next 将 i18n 或 t 函数传递给依赖项
【发布时间】:2021-03-30 12:09:01
【问题描述】:

我有两个存储库。一个带有 nextjs 应用程序,第二个带有动态加载到第一个 repo 中的组件。

由于第二个 repo 中的某些组件包含翻译,我需要传递一个 t 函数或 i18n 实例(翻译文件和 next-i18next 初始化在第一个 repo 中)。

我尝试使用上下文提供程序传递它,但没有奏效:

TypeError: 无法读取未定义的属性“翻译器”

有没有推荐的方法来实现这一点?

【问题讨论】:

    标签: reactjs next.js i18next react-i18next next-i18next


    【解决方案1】:

    由于在运行时您的组件共享相同的 React “树”,因此有很多方法可以满足您的要求:

    1. 传递t 方法本身 - 在您的组件和它的环境之间创建一对。
    <InnerComponent t={t} />
    
    1. 将已翻译的文本传递给组件 - 您的组件可能仍然是“通用”用途。但有时大型组件可能需要很多文本,会导致大量道具。
    <InnerComponent title={t('MY_TITLE')} />
    

    每种方法都有优缺点,请决定哪种方法适合您的要求。

    【讨论】:

      猜你喜欢
      • 2022-11-14
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-04-06
      • 1970-01-01
      • 2019-07-26
      • 1970-01-01
      • 2016-10-08
      相关资源
      最近更新 更多