Need replace html string text from react component

Question

Issue : - we are facing the shortcode issue. we use shortcode {{email}} for email subscription in content and the server provides content as HTML string on the frontend side. we render string to HTML on the frontend side from dengerouslySetInnerHTML react function..

Example : - let description = '<p>contect here {{email}} content here {{email}} content here</p>';

we use react dengerouslySetInnerHTML function that convert HTML string to actual HTML. <div dangerouslySetInnerHTML={{ __html: description }} ></div>

I'm doing - replacing {{email}} text from react email component but we are not able to insert react component in the string.

Like - description.replace('{{email}}', <EmailComponent />)

score 1 · Answer 1 · answered May 28 '19 at 06:52

1

i think you can convert <EmailComponent /> to string

import { renderToString } from 'react-dom/server'

console.log(description.replace('{{email}}', renderToString(<EmailComponent />)))

answered May 28 '19 at 06:52

Giang Le

6,446
4
23
26

1

import { renderToString } from 'react-dom/server' its not work in react-static – Avneesh Kumar May 28 '19 at 07:09
This is awesome and resolved the issue. Thanks a lot. – Mayeenul Islam Feb 05 '23 at 13:52

Need replace html string text from react component

1 Answers1