React Intl - Невозможно прочитать свойство formatMessage из undefined

  ....
 const func1 = (intl) => {
  const text = intl.formatMessage({id: 'mesage'});
  const func2 = () => {
     return {
      <div>.....
      placeholder={text}</div>
   };
  };
    return {
   <div>.....
   {func2()}</div>
  };
 };

экспорт по умолчанию withStyles (стили) (injectIntl ​​(component)); `}

Я пытаюсь использовать injectIntl ​​для перевода строк с помощью библиотеки response-intl, но продолжаю получать следующую ошибку:

«Невозможно прочитать свойство 'formatMessage' из undefined»

Я пытаюсь сделать что-то вроде этого: React-Intl Как сделать использовать FormattedMessage во входном заполнителе


person user9081274    schedule 11.02.2019    source источник


Ответы (2)


Так можно использовать ...!

Самое простое решение для PlaceHolder Antd.

    import {injectIntl} from "react-intl";

    class DemoForm extends React.Component {
        render() {
            const {getFieldDecorator} = this.props.form;
            const {intl} = this.props;
            const placeholder = intl.formatMessage({id:'enterHere'});
            return (
                <Form.Item label={<FormattedMessage id='name'/>}>
                    {getFieldDecorator('name',)(<Input placeholder={placeholder}/>)}
                </Form.Item>
            )
       }
}
export const Demo = injectIntl(Form.create()(DemoForm));
person Farrukh Malik    schedule 03.08.2020

Вы можете использовать props.intl.formatMessage({id: 'mesage'});, intl объект включен в props.

Далее, предполагая, что Mycomponent обернут, тогда:

const MyComponent = ({intl}) => { // we are extracting intl from prop object
// component code here
}
person Umair Farooq    schedule 11.02.2019
comment
Пожалуйста, примите или проголосуйте, если на ваш вопрос ответят спасибо - person Umair Farooq; 11.02.2019
comment
он работает, но выдает предупреждение об ошибке: необходимо использовать деструктивное назначение реквизита - person user9081274; 11.02.2019
comment
Затем вы можете использовать const {intl} = props;, в зависимости от того, является ли ваш компонент компонентом класса, тогда const {intl} = this.props; and then use intl.formatMessage ({id: 'mesage'}); ` - person Umair Farooq; 11.02.2019
comment
хорошо, я думаю, это сработало. Я не могу проголосовать за вас, так как у меня мало отзывов. Хотя большое вам спасибо - person user9081274; 11.02.2019
comment
У меня есть еще одна функция MyComponent.defaultprops, которая требует от меня того же, но находится за пределами MyComponent. Как в таком случае перевести строку? - person user9081274; 11.02.2019
comment
Вы также можете обернуть этот компонент в injectIntl - person Umair Farooq; 11.02.2019