ReactJs machen einfach JSON

Question

Ich habe einfach json

{"id":157,"content":"Hello, World!"} 

I id in einem div und Inhalt in anotther machen möchten. Problem für mich ist, wenn ich {this.state.data.content} zweimal anrufe, stürzt es ab.

var Stuff = React.createClass({ 
    getInitialState: function() { 
     return { 
      data: [] 
     }; 
    }, 
    componentDidMount: function() { 
     $.ajax({ 
      url: "http://rest-service.guides.spring.io/greeting", 
      dataType: 'json', 
      cache: false, 
      success: function(response) { 
      this.setState({ 
       data: response 
      }); 
      }.bind(this), 
      error: function(xhr, status, err) { 
      console.error(this.props.url, status, err.toString()); 
      }.bind(this) 
     }); 
    }, 
    render: function() { 
     return (
      <div>Response - {this.state.data.content}</div> 
     ); 
    } 
}); 

Answer 1

das Problem durch umgebende jsx mit einem anderen div

gelöst

return (
    <div> 
     <div>Response - {this.state.data.content}</div> 
     <div>id - {this.state.data.id}</div> 
     </div> 
    ); 

Answer 2

Nun, versuchen, eine Zeichenfolge anstelle eines Objekts

render: function() { 
    return (<div> Whatever - {JSON.stringify(this.state.data)}</div>) 
} 

Tipp zu machen:

wenn Sie möchten, um es schön zu machen: benutzen Sie JSON.stringify(this.state.data, null, 2)