Передать переведенный текст как реквизит - PullRequest
Новая
       24

Передать переведенный текст как реквизит

0 голосов
/ 16 ноября 2018

Для локализации я использую React-intl.Я экспортирую ниже (intl.js) - 

import { injectIntl } from 'react-intl';

const Intl = injectIntl(({ intl, children }: any) => children(intl));

const t = (
id: string | Array<string>,
values: Object | void,
) => <Intl>{i => i.formatMessage({ id }, values)}</Intl>;

export default t;

И там, где мне нужно перевести строки, я импортирую выше файл, как - 

import t from '../../../components/intl.js';

У меня есть enФайл .json, для которого определены переводы, например - 

"tri-pod":"tripod"

Я могу использовать перевод как - 

<span>{t`tri-pod`}</span>

Проблема в том, как использовать переводы при отправке.как показано ниже: 

<mylabel label="tripod"></mylabel>

Добавление label = {t tri-pod} ошибок.Как правильно перевести саму переведенную строку в качестве реквизита?

1 Ответ

0 голосов
/ 16 ноября 2018

Проблема с помощником t заключается в том, что он не выводит переведенную строку, как ожидается от помощника i18n, но выводит элемент <Intl>. Это ограничивает его возможное использование.

Чтобы получить переведенную строку с t, компонент, вероятно, должен быть улучшен компонентом более высокого порядка: 

const withT = Comp => injectIntl(({ intl, ...props}) => <Comp
  t={(id, values) => intl.formatMessage({ id }, values)}
  {...props}
/>);

Тогда помощник t будет доступен как t prop в расширенных компонентах.

...