Как заставить useIntl () использовать контекст компонента root для сообщений? - PullRequest
0 голосов
/ 23 марта 2020

Мне трудно понять, почему мой useIntl() не будет использовать messages, установленный в компоненте root.

Моя настройка

У меня есть withIntl() компонент более высокого порядка, который принимает макет страницы и предоставляет ему контекст intl, включая сообщения и информацию о локали и т. Д. c.

У меня есть Layout функциональный компонент который экспортируется withIntl(Layout)

У меня есть Country функциональный компонент, который представляет собой страницу, которая использует выше Layout. Внутри Country я пытаюсь установить метатег, который использует контекст Intl, который я установил обратно в Layout, используя withIntl()

Подход

Вот мой код, я поместил его в собственный функциональный компонент


const IntlHead = () => {
  const intl = useIntl() 
  return (
    <Head>
      <meta property="og:description" content={intl.formatMessage(Country.Heading.Overview)}/> 
    </Head>
  )
}

, а вот мой компонент Country:


export default class Country extends React.Component {
  render() {
    return (
      <Layout>
        <IntlHead />
      </Layout>
    )
  }
}

...