Render Content with Markup Using react-intl FormattedHTMLMessage

InstructorDamon Bauer

Share this video with your friends

Send Tweet

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

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

Dean
~ 7 years ago

What if I want the user to "select" the preferred language rather than basing it on their browser locale. What is the mechanism to achieve this? Say, for example, they selected the language from the dropdown or I pass it from the backend.

Nikolai
~ 6 years ago

What if I want the user to "select" the preferred language rather than basing it on their browser locale. What is the mechanism to achieve this? Say, for example, they selected the language from the dropdown or I pass it from the backend.

I guess, you can always set the global javascript constant in you html markup (which is generated on your server), like: <code><script>var _USER_LANGUAGE = "en-EN"</script></code> and get to this var on client side.