I have to prepare one static HTML and inside it, I have to render a react Link. But it is not working as expected and returns [object Object]. Here is my code.
const htmlCode = `<div class='info-container'>
<div class='heading-section'>
${<><Link to = {targetURL}>Click Here</Link></>}
</div>
<div>`
Output I am getting after rendering:
I have consoled that and getting output on console as shown below :
------------------------------------EDIT------------------------------------
The main goal here is, I want to pass this static HTML (variable htmlCode) to another component and that is not rendering but I get object instead of rendered as shown in console output attached here. Is there any way I can render that and convert it to a kind of static HTML before passing to other component?
JSX is not HTML, it is a syntactic sugar for HTML. You cannot wrap it around strings. It will transpile to React.createElement which returns a JavaScript object.
const htmlCode = <div class='info-container'>
<div class='heading-section'>
<Link to = {targetURL}>Click Here</Link>
</div>
<div>
See more of Rendering JSX elements