We have a requirement to load an HTML file within a react component. We can load the HTML file within a div using the "Cheerios" package. But the issue is, that we have a few hyperlinks within an HTML file and the respective files are also there. Now the requirement is when we click on the hyperlink, we want the HTML file to be loaded with the same div. Please find the folder structure below.
*public/
- index.html
- sample.html
- sample1.html*
index.html:
<HTML>
<header></header>
<body>
<ul>
<li><a href="sample.html"> Sample</a></li>
<li><a href="sample1.html"> Sample1</a></li>
</ul>
</body>
</html>
I can load the index.html with the react component. But when I Click on the sample.html link from index.html, the sample.html file path is updated in the browser bar.