Axios: chaining multiple API requests : <p>I need to chain a few API requests from the Google Maps API, and I'm trying to do it with Axios.</p>

<p>Here is the first request, which is in componentWillMount()</p>

<pre><code>axios.get('https://maps.googleapis.com/maps/api/geocode/json?&amp;address=' + this.props.p1)
  .then(response =&gt; this.setState({ p1Location: response.data }))  }
</code></pre>

<p>Here is the second request:</p>

<pre><code>axios.get('https://maps.googleapis.com/maps/api/geocode/json?&amp;address=' + this.props.p2)
  .then(response =&gt; this.setState({ p2Location: response.data }))
</code></pre>

<p>Then we have a third request, which is dependent on the first two being completed:</p>

<pre><code>axios.get('https://maps.googleapis.com/maps/api/directions/json?origin=place_id:' + this.state.p1Location.results.place_id + '&amp;destination=place_id:' + this.state.p2Location.results.place_id + '&amp;key=' + 'API-KEY-HIDDEN')
  .then(response =&gt; this.setState({ route: response.data }))
</code></pre>

<p>How can I chain these three calls so that the third happens after the first two?</p>
