Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Facebook React.js Example error?

I am tryin out Facebook's Reactjs library and found it awesome. I have ran through the exampe/tutorial and got it working.

Now i am at : http://facebook.github.io/react/docs/interactivity-and-dynamic-uis.html

And I am trying out the code:

/** @jsx React.DOM */

var LikeButton = React.createClass({
  getInitialState: function() {
    return {liked: false};
  },
  handleClick: function(event) {
    this.setState({liked: !this.state.liked});
  },
  render: function() {
    var text = this.state.liked ? 'like' : 'unlike';
    return (
      <p onClick={this.handleClick}>
        You {text} this. Click to toggle.
      </p>
    );
  }
});

React.renderComponent(
  <LikeButton />,
  document.getElementById('example')
);

After running the code above, i get nothing. In my google chrome console, the error i got was Uncaught SyntaxError: Unexpected token < , on the line starting with <p onClick={this.handleClick}>

I was wondering if there's anyone who can enlighten me as to what is wrong with the code ?

Best Regards.

like image 849
DjangoRocks Avatar asked Oct 12 '13 15:10

DjangoRocks


People also ask

How do I fix create React error?

i had this issue. The simple solution is to add latest versions of typescript, react-scripts libs. and then run npm install. it works for me.

Does Facebook still support React?

As of January 19, 2021, Facebook React Native SDK will no longer be officially supported by Facebook. Please visit our blog post for more information and Github for React Native going forward.

How do I turn off error in React?

The Yellow warning box in React Native can be both helpful and annoying. There are many errors that can be ignored but end up blocking necessary pieces of the application. To disable the yellow box place console. disableYellowBox = true; anywhere in your application.


1 Answers

Ok, i know what the mistake was.

Since i place the code in my question as an external file ( Like.js ), make sure that the script tag should read as follows:

<script type="text/jsx"  src="Like.js"></script>

The "text/jsx" is required!

Thanks!

like image 184
DjangoRocks Avatar answered Nov 02 '22 19:11

DjangoRocks