function createMarkup(str) {
return { __html: str };
}
function GraphicLarge({ HTMLData }) {
return (
<div className="graphic graphic--lg">
{ isFetching ? <div dangerouslySetInnerHTML={createMarkup(HTMLData)} /> : <Loading /> }
</div>
);
}
<!--
./statics/html/grafico1.html
# HTML que preciso inserir
# Eu busco esse HTML com uma requisição.
-->
<link href="https:/example.br/css/main.css" rel="stylesheet" type="text/css">
<div id="grafico">
<img src="https:/example.br/img/1.svg"alt="Imagem" />
<h1>Conteudo do gráfico</h1>
</div><!-- /#grafico -->
<script src="https:/example.br/js/libs/graph.js"type="text/javascript"></script>
<script src="https:/example.br/js/bundle.js"type="text/javascript"></script>
I'm doing a task that looks for a .html file, for example: A piece of a graphic. The thing is that the JS files of this html do not run (or even load) when the html is inserted into the DOM by the dangerouslySetInnerHTML function. The other static (CSS, Images and Fonts) are loaded without any problem.