Convert json string to HTML

I am trying to convert an String taken from an API to HTML code in a React.js project. To do so I have tried with document.write(), but I am having problems because there it keeps waiting for the URL responense.

The string from the API is this:

"<p><img class=\"aligncenter wp-image-3621 size-full\" src=\"https://cms.aldeasinfantiles.es/uploads/2018/07/oscar-rusia.jpg\" alt=\"\" width=\"884\" height=\"589\" srcset=\"http://aldeasinfantiles-wp.lin3sdev.com/uploads/2018/07/oscar-rusia.jpg 884w, http://aldeasinfantiles-wp.lin3sdev.com/uploads/2018/07/oscar-rusia-44x29.jpg 44w, http://aldeasinfantiles-wp.lin3sdev.com/uploads/2018/07/oscar-rusia-640x426.jpg 640w\" sizes=\"(max-width: 884px) 100vw, 884px\" /></p>\n<p><strong>Óscar tiene nueve años, vive en la Aldea Infantil SOS de Pachacamac, en Perú, y el próximo 15 de julio tendrá la oportunidad de vivir en directo la final del Mundial. </strong></p>\n<p>Es la recompensa obtenida tras participar en un concurso organizado por una conocida marca de alimentación, que solicitaba a los participantes elaborar un vídeo que alentara y animara al equipo nacional de Perú en la Copa del Mundo.</p>\n<p>&#8220;Cuando necesitaba tu estímulo me lo diste, ahora tendrás el mío. Chicos, tienen que entrar al campo y mostrar su talento. Tengo fe en ustedes. ¡Vamos, Perú!&#8221;. Se trata del mensaje que deja Óscar en el vídeo, que grabó con el apoyo de los educadores de la Aldea y que le ha permitido hacer su sueño realidad: durante la final de la Copa del Mundo en Moscú, Óscar entrará al estadio de la mano de uno de los jugadores de fútbol. Según nos dice, “será la experiencia más bonita de mi vida”.</p>\n<p>Días antes, viajará a Rusia junto a Flor, su educadora de referencia en la Aldea o madre SOS. Ambos asistirán a varias actividades organizadas para los ganadores del concurso.</p>\n<p>Óscar, que cursa cuarto de Primaria, entró a la Aldea de Pachacamac junto a sus dos hermanas en 2016, porque su madre no pudo cuidarlos adecuadamente. Flor nos cuenta que es un niño activo y enérgico: “Disfruta de las matemáticas, el arte y el deporte; también le gusta dibujar, cantar y pintar; pero, sin duda, su actividad favorita es el fútbol”.</p>\n<p>Su pasión por este deporte le ha valido una beca completa en la Academia Cantolao, donde asiste dos veces a la semana para entrenar. Además, cada domingo participa en campeonatos.</p>\n<p>Antes del partido televisado para definir la clasificación de Perú en la Copa del Mundo, Óscar preparó coloridas pancartas y lució la camiseta de la selección peruana. El día del torneo, Flor hizo palomitas de maíz y, junto a varios educadores y amigos, vieron el partido. “Porque es mucho más emocionante ver el fútbol así”, cuenta el protagonista de esta historia.</p>\n<p>Cuando Óscar entre en el estadio Luzhnikí, en Moscú, el próximo 15 de julio, toda su familia y amigos de la Aldea de Pachacamac estarán animándole desde el otro lado del mundo, orgullosos de que uno de sus niños pueda vivir esta experiencia única.</p>\n"

In the React.js project I use:

<div className='article-content'>{document.wrire(articulo.content.rendered)}</div>

This converts the string to HTML code, but the rest of the elements of the component dissapear. . How can I convert the string without this issue?

How’re you getting the data from the API? (for those that follow: I suspect an asynchronous fetch, which means the object is empty at time of rendering)

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.