View html-formatted code from the database on a Javascript page

Question

Hello. I’m building a Javascript blog with Next JS and recording the content of the post in Firebase. I wonder if there is any function in javascript so that when returning the content of the post with html tags merged into it, it displayed the formatted text. Example:

This is a paragraph

instead of

<p>Isto é um parágrafo</p>

This is the excerpt where I display the content that would come formatted:

<div className="column is-9">
   <div className="is-size-6">
     {content}
   </div>
   <br />
</div>

Answer 1

Your problem is you’re showing a string containing tags instead of code html for real.

//O seu content está vindo algo assim:

'<p>Isto é um parágrafo</p>'

This way javascript understands that the data is a string and shows it as is, without interpreting the tags. A solution would be to use the dangerouslySetInnerHTML that would be the code:

<div className="column is-9">

<div className="is-size-6" dangerouslySetInnerHTML={{ __html: content }}>

 </div>
 <br />
</div>

so he injects his string in div escaping the tags html.