React-intl cosnt <FormattedMessage />给出[object object]作为结果

Question

我正在使用"react-intl":"^ 2.4.0"和"react":"^ 16.2.0".

我试图将FormattedMessage标记的输出分配给常量并将其放在输入标记占位符中.

代码图片

预期输出输入字段,其中包含相应语言的文本,但它在文本框内出现[对象对象].

Answer 1

<FormattedMessage />是一个无法放置到placeholder期望原始String的组件.

import {injectIntl} from 'react-intl'; 

class TestComponent extends React.Component{
  render(){
    const { intl } = this.props;
    return (
        <input placeholder={intl.formatMessage({ id: "loginPage.username", defaultMessage: 'username'})}/>
    )
  }
}

export default injectIntl(TestComponent);