4

I am building web app in Reactjs. In the loop of mapping the records from data server, I get this error:

Expected Corresponding JSX closing

at this line

<h5>Still Water <br> 500 ml</h5> 

complete catalog.jsx code:

var React = require('react'); var Parse = require('parse').Parse; var ParseReact = require('parse-react'); module.exports = React.createClass({ mixins: [ParseReact.Mixin], getInitialState: function() { return { error: null, signup: false }; }, //Observe Function - a newly proposed function for prarse react integration observe: function() { //declare any variable you need here. return { product: (new Parse.Query('product')) .ascending('createdAt') }; }, render: function() { var content = ( <div> no product </div> ); if(this.data.product.length){ var content = ( <div > {this.data.product.map(function(p) { return ( //<div>Abdulrhman</div> //From Design <div className="col-md-4"> <div className="item text-center"> <div className="photo"> <img src="images/small-blue.png"> <br><br> <h5>Still Water <br> 500 ml</h5> </div> <div className="action"> <button type="button" className="btn btn-primary">Add</button> </div> </div> </div> ); }, this)} </div> ); } else{ var content = (<div> </div>) } return content; }, ImgSizeFnc: function(size){ if(size === 'small') return 'width="100px" height="1000px"'; } }); 

I need to figure out this error.

1 Answer 1

9

All tags need to be closed: Self-closing tags

You need a / in your <br> and <img> tags.

<br /> <img src="images/small-blue.png" /> 
Sign up to request clarification or add additional context in comments.

4 Comments

same error trace? exactly the same line with the error?
I did not get you, sorry, can you clarify?
yes same error trace with exactly same error line.
just edited as you need to do the same for the img tag

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.