Is it possible to load html page by using React component?

Question

For example, here is some of my React codes.

class App extends Component
{
    render(){
    return (
        <div className="App">
            <Header/>
            <LoginApp />       
            <Register />
            <Footer />      
        </div>
        );
    }
}
export default App

Now, I'd like to include the warning panel into this class, but the file was written using just only simple HTML and JavaScript codes. Is there any ways to load the dot html files into the React component class?

Here's the idea.

<div className="App">
        <Header/>      <--React Component 
        <LoginApp />   <--React Component      
        <Register />   <--React Component 
        <Footer />     <--React Component 
        // Load other external html files here... (Non React component)/
</div>

Thank you very much.

PS.I'm extremely new to React.

Why don't you make a component for it. This will help you in the long run — Gardezi
– Gardezi, Commented Jul 9, 2018 at 8:06
Not in a very easy way. Just convert the HTML to a React component (with something like transform.now.sh/html-to-jsx) and rewrite the JavaScript to be React-y. — AKX
– AKX, Commented Jul 9, 2018 at 8:08
Yep, that's one way of getting it done, but I'd like to know if it's possible or not. — user3505908
– user3505908, Commented Jul 9, 2018 at 8:09
@user3505908 check this solution ==> stackoverflow.com/a/46997182/4468132 — Gardezi
– Gardezi, Commented Jul 9, 2018 at 8:11

Samz · Accepted Answer · 2018-07-09 08:08:52Z

0

There are 2 ways for that

Fetching HTML or Setting as Inner HTML

visit this link, There is a code for explain how to do this Add html file to a react component

also this will help Add react to a simple HTML file

answered Jul 9, 2018 at 8:08

Samz

861 silver badge10 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Is it possible to load html page by using React component?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related