ReactJS error in syntax at render function

Question

I wrote a react class but Chrome is throwing a syntax error in the render function.

I'm attaching the code here:

var Chatrooms = React.createClass({

    getInitialState: function() {
        return {
            loaded: false,
            pages: undefined,
            id: "-1",
        };
    },

    loadPages: function() {
        url = "/chat/api/chatroom/" + this.props.course + "/get/?format=json";
        request = ajax_json_request(url, "GET", {});
        request.done(function(response) {
            response = jQuery.parseJSON(response);
            oldState = this.state;
            oldState['chatrooms']=response;
            oldState['loaded']=true;
            this.setState(oldState);
        }.bind(this));
    },

    componentDidMount: function() {
        if(!this.state.loaded) {
            this.loadPages();
        }
    },

    render: function(){
        console.log(this.state.chatrooms);
        return (
                <div></div>
            );
    }

});

Browser is showing the error in line <div></div> as Uncaught SyntaxError: Unexpected token <. I checked the syntax online and it looks good to me.

Are you transpiling the code from JSX to regular JavaScript? — magnudae
– magnudae, Commented Mar 3, 2015 at 12:50

Ranveer · Accepted Answer · 2015-03-04 06:45:19Z

1

Try adding the JSX pragma on the top of the JSX file:

/** @jsx React.DOM */

This is tells the browser to use the JSX directive.

answered Mar 4, 2015 at 6:45

Ranveer

6,8918 gold badges48 silver badges94 bronze badges

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

1 Comment

WiredPrairie Over a year ago

You shouldn't need that any more as part of 0.12.

Dhiraj · Accepted Answer · 2015-03-03 12:41:19Z

1

You must have used <script type="text/javascript"> instead of <script type="text/jsx">

answered Mar 3, 2015 at 12:41

Dhiraj

33.7k10 gold badges65 silver badges78 bronze badges

1 Comment

WiredPrairie Over a year ago

And here: facebook.github.io/react/docs/tooling-integration.html for more info.

Collectives™ on Stack Overflow

ReactJS error in syntax at render function

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related