error with react script rendering script tag in the body

Question

Am trying to render a react component but instead what i get is a script tag in my body here are my code can someone help me pls when i try to render i get the below response

var App =  React.Component({
    render () {
        return (
            <div>
                <h1>App</h1>
                <RouteHandler/>
            </div>
        )
    }
});




var routes = (
    <Route handler={App}>
    </Route>
);

Router.run(routes, Router.HashLocation, function(Root, state) {
    React.render(<Root location={state.path}/>, document.body)
});

<html><head>
        <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
        <meta name="format-detection" content="telephone=no">
        <meta name="msapplication-tap-highlight" content="no">
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
        <link rel="stylesheet" type="text/css" href="css/index.css">
        <title>Hello World</title>
    </head>
    <body><script data-reactid=".0"></script>

</body></html>

Could you paste the error?

Jayaram
– Jayaram

2016-05-08 10:57:52 +00:00
Commented May 8, 2016 at 10:57 — Jayaram
– Jayaram, Commented May 8, 2016 at 10:57

omerts · Accepted Answer · 2016-05-08 13:09:44Z

1

I am pressuming you are using React 0.13.x, since you are not using ReactDOM.render. Also, I am pressuming you are using ReactRouter < V1.0.0, since you are not using the router as a jsx element.

To fix your issue, change:

var App =  React.Component({
    render () {
        return (
            <div>
                <h1>App</h1>
                <RouteHandler/>
            </div>
        )
    }
});

To:

var App =  React.createClass({
    render () {
        return (
            <div>
                <h1>App</h1>
                <RouteHandler/>
            </div>
        )
    }
});

Here is a working fiddle: React + ReactRouter example

answered May 8, 2016 at 13:09

omerts

8,8782 gold badges34 silver badges40 bronze badges

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

Collectives™ on Stack Overflow

error with react script rendering script tag in the body

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related