Why some returns in React use round brackets while some use curly brackets?
Anonymous
I'm new to learning React and have only basic to Intermediate JavaScript skills.
Stateless functions in react use return
s with round brackets ()
like,
function Player(props) {
return (
<div className="player">
<div className="player-name">
{props.name}
</div>
<div className="player-score">
<Counter score={props.score} />
</div>
</div>
);
}
Notice the ()
(curly brackets) used with return.
Then in the blow example, one of the class method (render) uses a return with the same round brackets, but the other method (getInitialState) uses a return with curly brackets.
var Counter = React.createClass({
propTypes: {
score: React.PropTypes.number.isRequired,
},
getInitialState: function() {
return {
score: 0,
}
},
render: function () {
return (
<div className="counter">
<button className="counter-action decrement"> - </button>
<div className="counter-score"> {this.props.score} </div>
<button className="counter-action increment"> + </button>
</div>
);
}
});
Why is it like that? Please help me.