2

我最近在我的多页 React 应用程序中使用 React-Intl 进行国际化。

我编写了一个组件“IntlProviderWithLocal”来添加自定义语言环境。

import React from 'react'
import {IntlProvider, addLocaleData} from 'react-intl';

import zh_CN from '../../../components/i18n/zh_CN/angular_locale'

export default (props) => {
    const {children, ...last} = props            

    addLocaleData(zh_CN);    
    return (
        <IntlProvider {...last} messages={zh_CN} >
            {children}
        </IntlProvider>
    )
}

但我得到错误：

Error formatting message: "publish.card.preview" for locale: "zh_CN", using default message as fallback

我在 中设置了一个 BreakPoint react-intl/lib/index.es.js，它显示了var formatter = state.getMessageFormat(message, locale, formats).

是formats一个空数组。步进函数getMessageFormat，

return function () {
    var args = Array.prototype.slice.call(arguments);
    var cacheId = getCacheId(args);
    var format = cacheId && cache[cacheId];

    if (!format) {
        format = new (src$es5$$.bind.apply(FormatConstructor, [null].concat(args)))();

        if (cacheId) {
            cache[cacheId] = format;
        }
    }

    return format;
};

最后我Locale data added to IntlMessageFormat is missing a pluralRuleFunction for :zh_CN在format = new (src$es5$$.bind.apply(FormatConstructor, [null].concat(args)))();.

此刻，args是["预览", "zh_CN", Object]，cacheId是"["预览","zh_CN",[]]"，format是undefined

有没有办法正确添加自定义语言环境数据

4

1 回答 1

1

您似乎没有将翻译传递给提供者。

messages={zh_CN}应该是包含您的翻译的键值存储，例如：

messages = {
    "publish.card.preview": "Preview"
}
return <IntlProvider {...last} messages={messages} >
    ...
</IntlProvider>
于 2017-08-02T10:07:54.373 回答