Uncaught Error: Parse Error: Line 13: Unexpected identifier

Question

I am new to ReactJS and learning some samples exercises online. Have trouble rendering a simple tag on the browser. Have an Uncaught syntax error that doesnt make sense.

I am returning only 1 tag which was the only nesting issue reported on React related issue in this forum. Can you help me troubleshoot this pls.

Code below

/** @jsx React.DOM */ var MySelect = React.createClass({ getInitialState: function(){ return { selected:false }; } render: function(){ var mySelectStyle = { border: '1px solid #999', display: 'inline-block', padding: '5px' }; return ( //react div element, via JSX, containing <MyOption> component <div style={mySelectStyle}> <MyOption value="Volvo"></MyOption> <MyOption value="Saab"></MyOption> <MyOption value="Mercedes"></MyOption> <MyOption value="Audi"></MyOption> </div> ); } }); var MyOption = React.createClass({ /* render: function(){ return <div> {this.props.value} </div> ; } */ }); ReactDOM.render(<MySelect />, document.getElementById('app')); </script> </body> </html>

You should create a pastebin example in this case, it's not so clear to understand where the error appears. — Ema.jar
– Ema.jar, Commented Dec 28, 2016 at 12:18

Shubham Khatri · Accepted Answer · 2016-12-28 12:13:11Z

You need to separate you functions by , . Also make sure you are using babel to transpile your jsx code.

var MySelect = React.createClass({ getInitialState: function(){ return { selected:false }; }, render: function(){ var mySelectStyle = { border: '1px solid #999', display: 'inline-block', padding: '5px' }; return ( //react div element, via JSX, containing <MyOption> component <div style={mySelectStyle}> <MyOption value="Volvo"></MyOption> <MyOption value="Saab"></MyOption> <MyOption value="Mercedes"></MyOption> <MyOption value="Audi"></MyOption> </div> ); } }); var MyOption = React.createClass({ render: function(){ return <div> {this.props.value} </div> ; } }); ReactDOM.render(<MySelect />, document.getElementById('app'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> <div id="app"></div>

Thanks you are right. Yes I missed the , have added it to the code and changed the library to 15.1 as you have shared. Thanks. Have few more errors but may be will compile in Babel without jsx and revert

duwalanise · Accepted Answer · 2016-12-28 12:12:57Z

0

MyOption component is not returning anything here. May be thats the reason for the error.

answered Dec 28, 2016 at 12:12

duwalanise

1,3021 gold badge14 silver badges24 bronze badges

1 Comment

Sriram Vasudevan Over a year ago

Have tried uncommenting the return stmt but still errors.

Collectives™ on Stack Overflow

Uncaught Error: Parse Error: Line 13: Unexpected identifier

2 Answers 2

1 Comment

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Related