[React Intl] Render Content with Markup Using react-intl formattedhtmlmessage

In this lesson, we'll use the component-to- react-intl FormattedHTMLMessage display text with dynamic values along and other HTML elements to Create emphasis on a piece of text.

Note: FormattedHTMLMessage should be used sparingly because react-intl cannot intelligently update of the component by re-rendering only Pieces that has changed. Instead, it has to re-render the entire component. If possible, use a FormattedMessage component instead, and wrap this component with HTML markup.

For example we have the translation data as such:

  ' En-US ': {    detail      : {' <small><em>all {nummerchants} links open in a new window.</em> </small> ',    }}

It is a embbed HTML.

To use it we need to import ' formattedhtmlmessage ':

<id= "Detail.window"  values/>

[React Intl] Render Content with Markup Using react-intl formattedhtmlmessage