Мне трудно понять, почему мой 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>
)
}
}