title: Is it possible to make a state array from this JSON object?
body: <p>A newbie in React here. I'm using axios to retrieve this object requested to my Django server rest framework Api:</p>
  
  <pre><code>{
      "count": 3,
      "next": null,
      "previous": null,
      "results": [
          {
              "id": 1,
              "url": "http://localhost:8000/blog/api/categories/1/",
              "title": "Django",
              "slug": "django"
          },
          {
              "id": 2,
              "url": "http://localhost:8000/blog/api/categories/2/",
              "title": "Git",
              "slug": "git"
          },
          {
              "id": 3,
              "url": "http://localhost:8000/blog/api/categories/3/",
              "title": "Introduction to docker",
              "slug": "introduction-to-docker"
          }
      ]
  }
  </code></pre>
  
  <p>So far I've been able to store those variables in separate arrays. This is the implementation of my FetchDemo.js:</p>
  
  <pre><code>import React, {Component} from 'react';
  import axios from 'axios';
  
  {/* https://daveceddia.com/ajax-requests-in-react/ */}
  
  class FetchDemo extends Component {
  state = {
      urls: []
  }
  state = {
      titles: []
  }
  state = {
      slugs: []
  }
  
  componentDidMount() {
          axios.get(`${this.props.url}${this.props.path}`).then(res =&gt; {
          const urls = res.data.results.map(num =&gt; num.url);
          const titles = res.data.results.map(num =&gt; num.title);
          const slugs = res.data.results.map(num =&gt; num.slug);
          this.setState( {urls} );
          this.setState( {titles} );
          this.setState( {slugs} );
      });
  }
  
  render() {
      return (
      &lt;div&gt;
          &lt;h1&gt;{`${this.props.url}${this.props.path}`}&lt;/h1&gt;        
          &lt;ul&gt;
              /// How to generate the JSX objects? ///
          &lt;/ul&gt;
      &lt;/div&gt;
      );
  }
  }
  
  export default FetchDemo;
  </code></pre>
  
  <p>Is it possible to build in the axios request a state array from this JSON object like the next one instead? How do I generate JSX with this new state categories?</p>
  
  <pre><code>this.setState({
          categories: [
          {url: "http://localhost:8000/blog/api/categories/1/", title: "Django", slug: "django"},
          {url: "http://localhost:8000/blog/api/categories/2/", title: "Git", slug: "git"},
          {url: "http://localhost:8000/blog/api/categories/3/", title: "Introduction to Docker", slug: "introduction-to-docker"},
          ]
      }
      )
  </code></pre>
  
  <p>I wish I knew more React and JavaScript. Any help is appreciated, thanks in advance.</p>