Languages
[Edit]
EN

React - render component as String (HTML in String)

1 points
Created by:
Dirask JS Member
3610

In this article, we would like to show you how to get render component as HTML String in React.

Quick solution: 

import ReactDOMServer from 'react-dom/server'

const htmlString = ReactDOMServer.renderToString(element);

Practical example:

import reactDOMServer from 'react-dom/server'

const App = () => {
  return <div className="App">
    Some text inside...
  </div>
}

console.log(reactDOMServer.renderToString(<App/>));

Result: 

<div class="App" data-reactroot="">Some text inside...</div>

Note:

renderToString() is the method typically used in the server-side rendering.

References: 

ReactJS

React - render component as String (HTML in String)
Native Advertising
🚀
Get your tech brand or product in front of software developers.
For more information Contact us
Dirask - we help you to
solve coding problems.
Ask question.

❤️💻 🙂

Join