title: TypeError: Cannot read property "map" of undefined
body: <p>I'm following the ReactJS <a href="https://reactjs.org/docs/faq-ajax.html" rel="nofollow noreferrer">AJAX and APIs tutorial</a>. I wrote a simple API in Spring, then a React component to consume that API at <code>http://localhost:8080</code>. The API currently returns a list of two items as follows:</p>
  
  <pre><code>[
      {brand:"Asus", make:"AAA"},
      {brand:"Acer", make:"BBB"}
  ]
  </code></pre>
  
  <p>Here's what my component looks like:</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  
  import { environment } from '../environment/environment';
  
  export class ComputerList extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        error: null,
        isLoaded: false,
        items: [
          {brand: null, make: null}
        ]
      };
    }
  
    componentDidMount() {
      fetch("http://localhost:8080/computers")
      .then(res =&gt; res.json())
      .then(
        (result) =&gt; {
          // correctly displays the results
          console.log(result);
          this.setState({
            isLoaded: true,
            items: result.items
          });
        },
        (error) =&gt; {
          this.setState({
            isLoaded: true,
            error
          });
        }
      )
    }
  
    render() {
      const { error, isLoaded, items } = this.state;
  
      if(error) {
        return(&lt;div&gt;Error: {error.message}&lt;/div&gt;);
      }
      else if(!isLoaded) {
        return(&lt;div&gt;Loading...&lt;/div&gt;);
      }
      else if(items) {
        console.log(items);
        // error here: cannot read property "map" of undefined
        // because this.state.items is undefined somehow?
        return(
          &lt;ul&gt;
            {items.map(item =&gt; (
              &lt;li key={item.make}&gt;{item.brand} {item.make}&lt;/li&gt;
            ))}
          &lt;/ul&gt;
        );
      }
    }
  }
  </code></pre>
  
  <p>At line 24, the results are successfully retrieved and logged.</p>
  
  <p>But at line 54, when I try to map each result to a <code>&lt;li&gt;</code> item, the <code>TypeError</code> is thrown because <code>items</code> is somehow undefined? I've followed the answer to a <a href="https://stackoverflow.com/questions/45419575/react-cannot-read-property-map-of-undefined">similar question</a> by initializing <code>items</code> at line 12, and checking <code>items</code> at line 48, to no avail.</p>
  
  <p>How can I fix this?</p>