i18nProvider针对默认语言环境的消息返回了Promise反应管理员

如何解决i18nProvider针对默认语言环境的消息返回了Promise反应管理员

您的期望：
设置初始语言环境的值为localStorage.getItem('locale_language');，而不是 'en' 。

import polyglotI18nProvider from 'ra-i18n-polyglot'; // react-admin 

const i18nProvider = polyglotI18nProvider(locale => {
    if (locale === 'ru') {
        return import('./i18n/ru').then(messages => messages.default);
    }
    return englishMessages;
},'en'); 

发生了什么事

但是当我这样做时，会出现错误Error: The i18nProvider returned a Promise for the messages of the default locale (ru). Please update your i18nProvider to return the messages of the default locale in a synchronous way.

相关代码：

这是我从localStore获得价值的方式

export function getLocalLanguage(): string {
    let defaultLocalLanguage = 'en';
    const storedLanguage = localStorage.getItem('locale_language');
    if (storedLanguage !== null) {
        defaultLocalLanguage = storedLanguage;
    }
    return defaultLocalLanguage;
}

这是我为polyglotI18nProvider设置初始本地内容的方式

const i18nProvider = polyglotI18nProvider(locale => {
    if (locale === 'ru') {
        return import('./i18n/ru').then(messages => messages.default);
    }
    return englishMessages;
},getLocalLanguage());

Here is said localStorage is syncronous，那么应该没有问题吗？

resolveBrowserLocale可能是替代方法，但我需要一种更持久的语言存储方式。

解决方法

从localStorage提取数据时，您似乎将默认语言环境设置为'ru'，但是import字符串的'ru'是异步的。

从documentation到ra-i18n-polyglot：

默认语言环境的消息（由react-admin用于初始渲染）必须以同步方式返回。

他们给出的example建议，如果要动态解析 default （= initial ）语言环境，则需要同步导入所有可能的语言：

import englishMessages from 'ra-language-english';
import frenchMessages from 'ra-language-french';

const messages = {
    fr: frenchMessages,en: englishMessages,};

const i18nProvider = polyglotI18nProvider(
    locale => messages[locale] ? messages[locale] : messages.en,resolveBrowserLocale()
);

编辑：更多代码