ReactDom.render is no longer supported in React 18

ReactDom.render is no longer supported in React 18

From the latest version of React JS (version 18) brings about various changes and one among them is the way the React DOM renders. ReactDom.render is no longer supported as it is being deprecated starting from React 18. Hence we need to use createRoot instead to create a React root and then we can call the render method on the React root.

Earlier you can write code like:

var template = <p>Hello React World!</p>;
var appRoot = document.getElementById('root');

ReactDOM.render(template, appRoot);

Now you need to write it like this using the createRoot to create the document root element and on that we can call the render method.

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
    <p>Hello React World!</p>
  </React.StrictMode>
);

This change was brought about from the latest version of React JS from the React JS version 18.

Related Posts