title: Getting empty object in axios GET request
body: <p>I am pulling posts from WordPress blog site. But when I console log state <code>posts</code> and <code>response</code> in <code>.then()</code> I get <code>Response</code> as <code>empty object [object object]</code> and <code>state</code> as <code>undefined</code>. </p>
  
  <p>Where am I going wrong? </p>
  
  <p>I am also getting following error: </p>
  
  <blockquote>
    <p>TypeError: Cannot read property 'map' of undefined</p>
  </blockquote>
  
  <p>Code:</p>
  
  <pre><code>import React, {Component} from 'react';
  import axios from 'axios';
  import Post from './Post/Post';
  
  class Blog extends Component {
  
      state = {
          posts: []
      }
  
      componentDidMount(){
          axios.get("https://public-api.wordpress.com/rest/v1.1/sites/ishhaanpatel.wordpress.com/posts")
          .then( response =&gt; {
              this.setState({posts: response.posts});
              console.log("Here are the posts: "+ this.state.posts);
              console.log("Here is the response: "+ response);
  
          });
      }
  
      render(){
           const posts = this.state.posts.map( post =&gt; {
               return &lt;Post title={post.title} key={post.ID} author={post.author.name}  /&gt;;
           });
          return (
              &lt;div&gt;
                  {posts}
              &lt;/div&gt;
          );
      }
  }
  
  export default Blog;
  </code></pre>