React Intl模板字符串抛出遗漏的ID警告

时间:2019-04-02 15:14:29

标签: reactjs internationalization react-intl

我正在尝试通过react-intl将一些值注入翻译后的句子中。 按照官方文档,我能够在本地化文件中定义一些模板消息,看起来像这样。

+------------+-------------------------------------------------------------------+
| Action     | Description                                                       |
+------------+-------------------------------------------------------------------+
| SELECT     | This event is raised whenever a SELECT is issued.                 |
| UPDATE     | This event is raised whenever an UPDATE is issued.                | 
| INSERT     | This event is raised whenever an INSERT is issued.                | 
| DELETE     | This event is raised whenever a DELETE is issued.                 | 
| EXECUTE    | This event is raised whenever an EXECUTE is issued.               | 
| RECEIVE    | This event is raised whenever a RECEIVE is issued.                | 
| REFERENCES | This event is raised whenever a REFERENCES permission is checked. | 
+------------+-------------------------------------------------------------------+

此字段直接在本地化对象内部传递。

比我使用的是一个非常简单的自定义Plural组件

ratingMsgTemplate: {
    id: "_ratingMsg",
    defaultMessage: "{pointCount, plural, one {{point}} other {{points}}}"
},

这是使用示例

import * as React from "react";

import { injectIntl } from "react-intl";
import { inject, observer } from "mobx-react";

const i18nPluralNumber = (props: any) => {
    const { locale, intl, msgId, ...msgParams } = props;
    let finalMessage;

    if (!(msgId in locale.messages)) {
        console.warn("Id not found in i18n messages list: " + msgId);
        finalMessage = msgId;
    } else {
        finalMessage = locale.messages[msgId];
    }

    return (
        <span className="plural-number-intl">
            {intl.formatMessage(finalMessage, { ...msgParams })}
        </span>
    );
};

export default inject("locale")(injectIntl(observer(i18nPluralNumber)));

除了令人讨厌的东西之外,它就像一个魅力 。 在控制台中,我收到以下消息: I18nPluralNumber.tsx:19 [React Intl]缺少消息:语言环境“ _ratingMsg”:“ de”,使用默认消息作为后备。

这是正确的,因为我的翻译文件中没有任何 _ratingMsg ID。实际上,我添加此ID的唯一原因是必须在react-intl docs之后添加该ID,而没有此ID则根本无法工作

有人可以给一些技巧/建议如何管理这些东西吗? 任何信息,我将不胜感激。

1 个答案:

答案 0 :(得分:0)

如果它可以帮助任何人。除了这个拐杖,我没有找到任何正常的解决方案。 我已使用此键添加了ID,并为每个ID复制了defaultMessage。

例如

ratingMsgTemplate: {
    id: "_ratingMsg",
    defaultMessage: "{pointCount, plural, one {{point}} other {{points}}}"
},

我只是使用id为_ratingMsg的defaultMessage值创建

_ratingMsg: "{pointCount, plural, one {{point}} other {{points}}}",
ratingMsgTemplate: {
    id: "_ratingMsg",
    defaultMessage: "{pointCount, plural, one {{point}} other {{points}}}"
},

现在它不会对丢失的ID发出警告,它的作用类似于模板字符串。

很奇怪,但是我没有找到更好的解决方案