title: How to use map() with data from axios response?
body: <p>I'm using axios to get data from the server and storing it in the state. When I do <code>state.map( post =&gt; {console.log(post)} )</code>, I do not see anything.</p>
  
  <p>I'm using <code>Express</code>, <code>Mongoose</code>, <code>NextJS</code> and <code>Axios</code>.</p>
  
  <p>I'm using <code>axios</code> to get data from the server and storing it in <code>this.state.posts</code>. When I do <code>console.log(this.state.posts)</code> in <code>componentDidMount</code>, it logs the posts array perfectly. But when I do the same in 
  <code>render(){ return ( /*here*/)}</code>
  it does not show anything.</p>
  
  <p>This logs all the posts without an error</p>
  
  <pre><code>async componentDidMount() {     
          const { data } = await axios.get('/api/all')
          this.setState({posts: data, isLoading: false})
          console.log(this.state.posts)
      }
  </code></pre>
  
  <p>But this does not log anything - </p>
  
  <pre><code>render() {
    return({ 
      posts.map( post =&gt; {
        &lt;Post title={post.title} /&gt;
      })  
    })
  }
  </code></pre>