title: loading Multiple URLS using fetch in React
body: <p>I am attempting to fetch multiple URLs in React using the <code>Promise.all()</code> method:</p>
  
  <pre><code>const urls = [
    "https://thesession.org/members/nearby?latlon=53,-6&amp;radius=1000&amp;format=json&amp;perpage=50&amp;page=2",
    "https://thesession.org/members/nearby?latlon=53,-6&amp;radius=1000&amp;format=json&amp;perpage=50&amp;page=3",
    "https://thesession.org/members/nearby?latlon=53,-6&amp;radius=1000&amp;format=json&amp;perpage=50&amp;page=4"
  ];
  
  Promise.all(urls.map(url =&gt; fetch(url).then(res =&gt; res.json()))).then(
    members =&gt; {
      console.log(members);
      this.setState({
        nearbymems: members.members
      });
    }
  );
  </code></pre>
  
  <p>The console.log is returning all of the URLs together but it is not displaying them on my map application.
  I have declared an empty array in my state : <code>nearbymems: []</code></p>
  
  <p>I will also post my render() function for displaying the data as markers in leaflet: </p>
  
  <pre><code>{this.state.nearbymems.map(members =&gt; (
    &lt;Marker
      position={[members.location.latitude, members.location.longitude]}
      icon={myIcon1}
    &gt;
      &lt;Popup&gt;
        &lt;h1 className="lead"&gt;{members.name} &lt;/h1&gt;
  
        &lt;PopupModal initialModalState={true} /&gt;
      &lt;/Popup&gt;
    &lt;/Marker&gt;
  ))}
  </code></pre>
  
  <p>Thank you.</p>
  
  <p><strong>edit:</strong></p>
  
  <p>Output of array: </p>
  
  <pre><code> (3) [{…}, {…}, {…}]
   0:
     format:"json"
     latlon:"53,-6"
     members: Array(50)
     0:
        bio:" "
        date:""
        id:44967
        location:
           {latitude: "53.31138992", longitude: "-6.24345493"}
        name: "______"
        url:"https://thesession.org/members/___"
   __proto__: Object
  </code></pre>