Quiero mostrar noticias en mi aplicación nativa de reacción, pero el contenido de la API está en HTML. Entonces, ¿puede decirme cómo renderizar HTML sin ninguna biblioteca?
"content": "<ul><li>Bitcoin, in terms of market value, rose 4.6% to $53,859.6.</li><li>It passed $50,000 mark for first time in four weeks on Tuesday. </li><li>Bitcoin fell below $50,000 in early September.</li>"Sin la biblioteca, puede representar HTML usando peligrosamente SetInnerHTML :
<div dangerouslySetInnerHTML={{ __html: response.content }}></div>Sin embargo, esto no se recomienda porque puede usarse para un ataque de secuencias de comandos entre sitios (XSS).
const yourDataObject = { "content": "<ul><li>Bitcoin, in terms of market value, rose 4.6% to $53,859.6.</li><li>It passed $50,000 mark for first time in four weeks on Tuesday. </li><li>Bitcoin fell below $50,000 in early September.</li>" } const area = document.getElementById("area") area.innerHTML = yourDataObject.content; <div id="area"></div> Decide dónde quieres mostrar tu HTML. En el siguiente ejemplo, voy a representar el contenido en la etiqueta div que tiene un atributo de id de "área".
<div id="area"></div> En su JavaScript, puede seleccionar el elemento con document.getElemenyById y pasar el valor del atributo id . A continuación, apunte al innerHtml del elemento div seleccionado y configúrelo para que sea su contenido.
const yourDataObject = { "content": "<ul><li>Bitcoin, in terms of market value, rose 4.6% to $53,859.6.</li><li>It passed $50,000 mark for first time in four weeks on Tuesday. </li><li>Bitcoin fell below $50,000 in early September.</li>" } const area = document.getElementById("area") area.innerHTML = yourDataObject.content;Siempre asegúrese de confiar en la fuente del HTML que está eligiendo para representar en su sitio. Si no controla la fuente, es posible que pueda generar código malicioso en su sitio.