title: Getting Object: "undefined" on React
body: <p>I am a newbie in react JS and I am trying to pull data from a url in Json format.
  I did the following but I keep on getting a feeback at the console as </p>
  
  <blockquote>
    <p>Rovers: undefined.</p>
  </blockquote>
  
  <p>How do I go about it when am supposed to get something like </p>
  
  <blockquote>
    <p>Rovers:[object, object, object]</p>
  </blockquote>
  
  <pre><code>class App extends React.Component {
   constructor(props){
     super(props);
     this.state={rovers:[]};
   }
  componentWillMount(){
    api.getRovers().then((response) =&gt;{
     this.setState({
       rovers: response.rovers
     });
   });
  }
  render() {
    console.log("Rovers: ", this.state.rovers);
  }
  </code></pre>
  
  <p>and this is where am calling the json link</p>
  
  <pre><code>var api={
    getRovers(){
     var url='https://jsonplaceholder.typicode.com/posts/1';
     return fetch(url).then((response)=&gt; response.json());
   }
  };
  module.exports=api;
  </code></pre>