按需加载翻译文件

Question

使用 i18next 进行翻译的标准方法通常包括在加载 Web 应用程序后立即加载所有翻译文件。

即

i18n
    .use(XHR)
    .use(LanguageDetector)
    .init({
        fallbackLng: 'en',
        debug: false,

        keySeparator: false,

        interpolation: {
            escapeValue: false,
            formatSeparator: ','
        },

        resources: {
            en: {
                translations: en
            },
            ru: {
                translations: ru
            },
            es: {
                translations: es
            }
        },

        ns: ['translations'],
        defaultNS: 'translations',

        react: {
            wait: true
        }
});

我发现这种方法效率很低，并且想根据需要从服务器请求翻译文件（即当客户端切换语言时）。不幸的是，我没有在官方文档中找到任何相关参考，但肯定应该有一种方法可以实现这一点。

我想要实现的架构：

1) Web 应用程序与仅默认翻译文件一起加载（例如 english.json）

2) 如果用户切换语言 – 比方说西班牙语 – spanish.json 正在从服务器加载并调整整个翻译。

Answer 1

来自 API documentation .init() 方法的配置选项：

partialBundledLanguages — allows some resources to be set on initialization while others can be loaded using a backend connector

因此，将选项设置为 true 将实现您的目标。

按需加载翻译文件

Loading translation files on demand

i18next

reactjs