Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

146
Vistas
How to htmlify response text

I am getting a response in text as follows

<span class='text-4xl'>description1</span>

And when i print it on screen:

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}
      </>
  );
};

Then it prints raw text as shown in image

How to render it in html form

ThankYou

about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

Here is a function for you to decode HTML entities, hope it helps:

function htmlDecode(input) {
  var escaped = new DOMParser().parseFromString(input, "text/html");
  return escaped.documentElement.textContent;
}

EDIT: This also works, but may risk XSS, make sure the HTML is clean before decoding:

function htmlDecode(input) {
    var escaped = document.createElement("textarea");
    escaped.innerHTML = input;
    return escaped.value;
}
about 4 years ago · Juan Pablo Isaza Denunciar

0

You can use this npm package, 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 */
      </>
    );
};

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda