Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

387
Visualizações
Representación de la respuesta html de la API en React

Estoy tratando de generar una respuesta html desde una API en React.

Creo que el problema puede ser que no estoy manejando correctamente la recuperación asíncrona. No estoy seguro de si la cadena html que obtengo del BE es una promesa o una cadena. Cuando lo registro a continuación, recibo una Promise

Usé el código de esta respuesta para usar dangerouslySetInnerHTML SetInnerHTML para representar el html, aunque no estoy seguro de si esta es la forma correcta de representar una página completa. El backendHtmlString es una página completa que me gustaría agregar a React.

App.js - Código de reacción para renderizar html:

 async function createMarkup() { let response; response = await fetch(`http://localhost:8000/backed_api/html_response/?user_email=chriss%40comtura.ai`) const backendHtmlString = response.text() console.log(backendHtmlString) return {__html: backendHtmlString}; } function MyComponent() { return <div dangerouslySetInnerHTML={createMarkup()} />; } function App() { return ( <div className="App"> <MyComponent/> </div> ); } export default App;

Index.js

 import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; ReactDOM.render( <React.StrictMode> <App /> </React.StrictMode>, document.getElementById('root') ); // If you want to start measuring performance in your app, pass a function // to log results (for example: reportWebVitals(console.log)) // or send to an analytics endpoint. reportWebVitals();
about 4 years ago · Santiago Trujillo
1 Respostas
Responde à pergunta

0

¡Las funciones asíncronas siempre devuelven una Promise ! Asegúrese de resolverlo para obtener los datos.

Consulte: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function

Dado que los datos se obtienen del backend, puede llevar algún tiempo. Puede usar useEffect para realizar la solicitud y establecer el valor que obtiene del servidor usando useState .

 function MyComponent() { const [html, setHTML] = useState({__html: ""}); useEffect(() => { async function createMarkup() { let response; response = await fetch(`http://localhost:8000/backed_api/html_response/?user_email=chriss%40comtura.ai`) const backendHtmlString = await response.text() console.log(backendHtmlString) return {__html: backendHtmlString}; } createMarkup().then(result => setHTML(result)); }, []); return <div dangerouslySetInnerHTML={html} />; }

Además, echa un vistazo a este escenario . Podría ser otro caso similar al tuyo.

about 4 years ago · Santiago Trujillo Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda