React Intl- невозможно прочитать свойство 'formatMessage' из неопределенного

Question

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

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

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

"Невозможно прочитать свойство 'formatMessage' из неопределенного"

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

Answer 1

Вы можете использовать этот способ..!

Самое простое решение для 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));

Answer 2

Я решил эту проблему, повторно импортировавintlв классе:

      import { useIntl } from "react-intl";

const MyClass = (props) => {

    const intl = useIntl();
    return ( 
      ...
      {intl.formatMessage({ id: "message" })    // <==now it works}
      ...
    )
}

Answer 3

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

Далее предполагая Mycomponent затем завернут:

const MyComponent = ({intl}) => { // we are extracting intl from prop object
// component code here
}