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'是异步的。

documentationra-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()
);

编辑:更多代码