Tengo que preparar un HTML estático y dentro de él, tengo que generar un enlace de reacción. Pero no funciona como se esperaba y devuelve [objeto Objeto]. Aquí está mi código.
const htmlCode = `<div class='info-container'> <div class='heading-section'> ${<><Link to = {targetURL}>Click Here</Link></>} </div> <div>`Salida que obtengo después de renderizar:
Lo he consolado y obtuve la salida en la consola como se muestra a continuación:
------------------------------------EDITAR------------- -----------------------
El objetivo principal aquí es, quiero pasar este HTML estático (código html variable) a otro componente y eso no se está procesando, pero obtengo un objeto en lugar de representarlo como se muestra en la salida de la consola adjunta aquí. ¿Hay alguna forma de representarlo y convertirlo en una especie de HTML estático antes de pasar a otro componente?
JSX no es HTML, es un azúcar sintáctico para HTML. No puedes envolverlo alrededor de cuerdas. Transpilará a React.createElement que devuelve un objeto JavaScript.
const htmlCode = <div class='info-container'> <div class='heading-section'> <Link to = {targetURL}>Click Here</Link> </div> <div>Ver más de Renderizar elementos JSX