CODEWITHSUNDEEP
reactjssyntax
I.Swen
I.Swen

Reputation: 61

Data error in ReactJS

I need some validation data. If the input data contains an error - display a message, if not - render component. Why this syntax contains an error (the first block if...else)? Thanks!

var WeatherItem = React.createClass({
  render: function() {
    if({this.props.cityid} == false){
        alert('false');
    }
    else{
    return (
      <div className = "weatherItem">
      <h2 className = "weatherHeader"> {this.props.type}</h2>
      <img className = "weatherImg"  src={this.props.src} />
      <p className = "weatherTemp" >{this.props.temp}{this.props.tempFrom}{this.props.tempTo} C</p>
      </div>
      );
    }
  }
});

var WeatherList = React.createClass({
  render: function() {
    var weatherNodes = this.props.data.map(function(weatherItem){
      return (
        <WeatherItem 
        cityid = {weatherItem.cityid}
        type = {weatherItem.type} 
        src = {weatherItem.src} 
        temp = {weatherItem.temp} 
        tempFrom = {weatherItem.tempFrom} 
        tempTo = {weatherItem.tempTo} 
        key = {weatherItem.id}>
        </WeatherItem>
        );
    });
    return (
      <div className="weatherList">
      {weatherNodes}
      </div>
      );
  }
});

ReactDOM.render(
  <WeatherBox url="weather.php" />,
  document.getElementById('content')
  );

Upvotes: 0

Views: 286

Answers (1)

Harshil Lodhi
Harshil Lodhi

Reputation: 7780

if({this.props.cityid} == false) is not a proper javascript syntax. Change this to if(this.props.cityid == false)

if({this.props.cityid} == false) can be used only when defining JSX Elements.

Upvotes: 1

Related Questions