是否可以使用React-intl作為變量？

Question

我正在使用react-intl和react-helmet ！ 我正在嘗試將元描述作為翻譯文本傳遞給Helmet，但似乎不可能！

這是我所做的：

<Helmet
     meta={[{ name: 'description', content: { id: 'homepage.description'} }]}
     link={[{ rel: 'icon', href: 'favicon/favicon-32x32.png' }]}
/>

homepage.description是lang/en/en.json上的文本。

我猜如果翻譯可以被抓取並用作變量，那么它就很容易使用，我將這樣做：

render() {
    const description = formatMessage({ id: 'homepage.description', values: {country: 'Morocco'} });
    return (
        <Helmet
              title={pageTitle}
              meta={[{ name: 'description', content:  {{description}} }]}
              link={[{ rel: 'icon', href: 'favicon/favicon-32x32.png' }]}
            />
    );
}

如果可能的話？ 還是請問有沒有其他替代方法或最佳實踐？

提前致謝

Answer 1

是的，如果使用injectIntl​​是可能的，這樣您就可以獲取轉換后的字符串並在需要時使用：

import {injectIntl} from 'react-intl';

...
render() {
    const intl = this.props.intl;
    const description = intl.formatMessage({ id: 'homepage.description', values: {country: 'Morocco'} });
    return (
        <Helmet
              title={pageTitle}
              meta={[{ name: 'description', content:  {{description}} }]}
              link={[{ rel: 'icon', href: 'favicon/favicon-32x32.png' }]}
            />
    );
}
...

export default injectIntl(YourComponent);

Answer 2

您可以簡單地做：

const Example = injectIntl( ({ intl }) => {
   return (
      <MyComponentt propExampple={ intl.formatMessage({ id: 'translation-ID' }) } />
   )
} );