0
151
VistasCómo htmlificar el texto de respuesta
Estoy recibiendo una respuesta en el texto de la siguiente manera
<span class='text-4xl'>description1</span>Y cuando lo imprimo en pantalla:
import React,{useContext, useEffect} from 'react'; import blogsContext from '../context/blogsContext'; import { useParams } from 'react-router-dom'; export const Blog_read = (props) => { const context = useContext(blogsContext) const slug = useParams().slug const {read_blog,readblog} = context useEffect(()=>{read_blog(slug)},[readblog]) props.changetitle(readblog.title) const title = readblog.title const description = readblog.description return ( <> {title} {description} </> ); }; Luego imprime texto sin procesar como se muestra en 
Cómo renderizarlo en formato html
Gracias
·
Juan Pablo Isaza
2 Respuestas
Responde la pregunta0
Aquí hay una función para decodificar entidades HTML, espero que ayude:
function htmlDecode(input) { var escaped = new DOMParser().parseFromString(input, "text/html"); return escaped.documentElement.textContent; }EDITAR: Esto también funciona, pero puede correr el riesgo de XSS , asegúrese de que el HTML esté limpio antes de decodificar:
function htmlDecode(input) { var escaped = document.createElement("textarea"); escaped.innerHTML = input; return escaped.value; }
·
Juan Pablo Isaza
Denunciar
0
Puede usar este paquete npm, html-to-react .
import React,{useContext, useEffect} from 'react'; import { Parser } from "html-to-react"; import blogsContext from '../context/blogsContext'; import { useParams } from 'react-router-dom'; const HtmlToReactParser = new Parser(); export const Blog_read = (props) => { const context = useContext(blogsContext) const slug = useParams().slug const {read_blog,readblog} = context useEffect(()=>{read_blog(slug)},[readblog]) props.changetitle(readblog.title) const title = readblog.title const description = readblog.description return ( <> {title} {HtmlToReactParser.parse(description)} /* This will do the job */ </> ); };
·
Juan Pablo Isaza
Denunciar
Responde la pregunta