How to retrieve a string in ReactIntl 2.0 without using FormattedMessage
You can easily return string using intl object provided by react-intl.
this is how you use intl object inside react class in much more easier way.
note: Render Component (main component) should wrap with IntlProvider
class MySubComponent extends React.Component{
{/*....*/}
render(){
return(
<div>
<input type="text" placeholder = {this.context.intl.formatMessage({id:"your_id", defaultMessage: "your default message"})}
</div>
)
}
}
MySubComponent.contextTypes ={
intl:React.PropTypes.object.isRequired
}
By defining contextTypes it will enable you to use intl object which is a context type prop. See react context for more details.
There is a better to solve placeholder
problem.
<FormattedMessage ...messages.placeholderIntlText>
{
(msg) => <input type="text" placeholder = {msg} />
}
</FormattedMessage>
Ok, there is a work around for that. I can add ReactIntl as the context in the component like this:
contextTypes: {
intl: React.PropTypes.object.isRequired,
},
Then when trying to retrieve the string of the message and use it, for example in a placeholder, I can do this.
<MyComponent ref="mycomponent" placeholder={this.context.intl.messages.placeholder}/>