How to render html string including script tags in React

How to do it

import React, { useRef, useEffect } from 'react';export default function TopView({ arrayIncludingHtml }) {
const contentRef = useRef();

useEffect(() => {
arrayIncludingHtml.map(a => {
const fragment = document.createRange().createContextualFragment(
` <div>${a.content}</div>`, // a.content is html string including script tag
);
if (contentRef.current) {
contentRef.current.appendChild(fragment);
} else {
return;
}
});
});
return (
<div ref={contentRef} />
);
}
createRange().createContextualFragment

Started LinkedIn as well!

https://www.linkedin.com/in/tomoharu-tsutsumi-56051a126/

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store