title: how to fetch array of objects from json
body: <p>This is the api <a href="http://skunkworks.ignitesol.com:8000/books/" rel="nofollow noreferrer">http://skunkworks.ignitesol.com:8000/books/</a> ,
  I am trying to fetch the array results from it using the fetch method but instead get an error cannot fetch value of undefined </p>
  
  <pre><code>import React, { Component } from 'react';
  
  class App extends Component {
    constructor() {
      super()
      this.state = {
        books: []
      }
    }
  
    componentDidMount() {
      fetch('http://skunkworks.ignitesol.com:8000/books/')
        .then(res =&gt; res.json())
        .then(data =&gt; this.setState({ books: data }))
        .catch(e =&gt; {
          console.log(e);
          return e;
        });
    }
  
    render() {
      let book = []
      book = this.state.books.results;
      console.log(book[0])
      return (
        &lt;div&gt;
          &lt;h1&gt;Books&lt;/h1&gt;
        &lt;/div&gt;
      )
  
    }
  }
  export default App;
  </code></pre>
  
  <p>this is my code.</p>
  
  <p>Also I have observed that json data are usually like [{}] but here it is {} format.
  please suggest me some solution.....</p>