Question

我想在我的反应应用中为我的i18n使用ICU标准。我想存储我的语言文件，例如http://userguide.icu-project.org/locale/localizing#TOC-.txt-resource-bundles：

de {
  key1 { "Deutsche Sprache "
         "schwere Sprache" }
  key2 { "Düsseldorf" }
}

我找到了这个图书馆http://formatjs.io/react/。 http://formatjs.io/支持ICU，但是我找不到任何好的示例如何使用我的应用程序连接我的语言文件。

我正在阅读他们的教程，似乎我可以使用组件<FormattedMessage>。例如，

var intlData = {
    "locales": "en-US",
    "messages": {
        "photos": "{name} took {numPhotos, plural,\n  =0 {no photos}\n  =1 {one photo}\n  other {# photos}\n} on {takenDate, date, long}.\n"
    }
};

React.render(
    <Component {...intlData} />,
    document.getElementById('example')
);

然后在某些组件中

...
render: function () {
        return (
            <p>
                <FormattedMessage
                    message={this.getIntlMessage('photos')}
                    name="Annie"
                    numPhotos={1000}
                    takenDate={Date.now()} />
            </p>
        );
    }

我最大的问题是如何转换我的语言文件，例如

en-US {
  photos { "{name} took {numPhotos, plural,\n  =0 {no photos}\n  =1 {one photo}\n  other {# photos}\n} on {takenDate, date, long}.\n" }
}

格式：

var intlData = {
    "locales": "en-US",
    "messages": {
        "photos": "{name} took {numPhotos, plural,\n  =0 {no photos}\n  =1 {one photo}\n  other {# photos}\n} on {takenDate, date, long}.\n"
    }
};

是否有任何解析器/转换器？

Answer 1

您应该检查此存储库https://github.com/gpbl/isomorphic500。在intl子目录中，有不同语言的输入文件。

您还可以看到他们采用哪种解析方式！希望这会有所帮助。

i18n for react，formatjs，react-intl

1 个答案: