我需要从Google Maps API中链接几个API请求,并尝试使用Axios完成此操作。
以下是第一个请求,在componentWillMount()中:
axios.get('https://maps.googleapis.com/maps/api/geocode/json?&address=' + this.props.p1)
.then(response => this.setState({ p1Location: response.data })) }
这是第二个请求:
axios.get('https://maps.googleapis.com/maps/api/geocode/json?&address=' + this.props.p2)
.then(response => this.setState({ p2Location: response.data }))
然后我们有第三个请求,这个请求依赖于前两个请求已经完成:
axios.get('https://maps.googleapis.com/maps/api/directions/json?origin=place_id:' + this.state.p1Location.results.place_id + '&destination=place_id:' + this.state.p2Location.results.place_id + '&key=' + 'API-KEY-HIDDEN')
.then(response => this.setState({ route: response.data }))
我该如何链接这三个调用,以便第三个调用发生在前两个之后?
allSettled
代替all
。并且在第3个请求中使用firstResponse.data.results.place_id
之前,最好添加更多的逻辑确认其实际存在的值。但总体思路已经表达清楚了。 - Matt Aft