如何在另一個axios中使用axios響應獲取React JS？

Question

目前我需要在下一個axios get中使用axios響應。

首先得到：

第一個GET返回例如版本ID。

axios.get('https://jira.example.co.uk/rest/api/2/project/PAD/versions', headers) 
.then(function(response) { 
    const versionID = response.data.map(function(version){  
     const vId = version.id; 

     return vId; 
    }); 

    return versionID; 
    }) 
    .catch(err => { 
     console.error(err, err.stack); 
    }); 

第二個GET：

現在我需要包括VERSIONID在下一個請求

axios.all([ 
    axios.get('https://jira.example.co.uk/rest/api/2/search?jql=project = 10005 AND fixVersion = versionID ORDER BY priority DESC, key ASC', headers), 
    axios.get('https://jira.example.co.uk/rest/api/2/search?jql=status IN (Reported) AND project = 10005 AND fixVersion = versionID ORDER BY priority DESC, key ASC', headers), 
    axios.get('https://jira.example.co.uk/rest/api/2/search?jql=status IN (Confirmed) AND project = 10005 AND fixVersion = versionID ORDER BY priority DESC, key ASC', headers)) 
    ]) 
    .then(axios.spread(function (response1, response2, response3) { ... } 

我將如何實現這一目標？

Answer 1

axios.get('https://jira.example.co.uk/rest/api/2/project/PAD/versions', headers) 
    .then(function(response) { 
      const versionID = response.data.map(function(version) { 
       const vId = version.id; 

       return vId; 
      }); 

      return axios.all([ 
       axios.get(`https://jira.example.co.uk/rest/api/2/search?jql=project = 10005 AND fixVersion = ${versionID} ORDER BY priority DESC, key ASC`, headers), 
       axios.get(`https://jira.example.co.uk/rest/api/2/search?jql=status IN (Reported) AND project = 10005 AND fixVersion = ${versionID} ORDER BY priority DESC, key ASC`, headers), 
       axios.get(`https://jira.example.co.uk/rest/api/2/search?jql=status IN (Confirmed) AND project = 10005 AND fixVersion = ${versionID} ORDER BY priority DESC, key ASC`, headers))]); 
    }).then(axios.spread(function(response1, response2, response3) { ... 
      }) 
      .catch(err => { 
       console.error(err, err.stack); 
      }); 

您將結果鏈接爲定期承諾。您在第一個電話中返回下一個axios電話，然後獲得響應。

Answer 2

實現此目的的一種方法是隻在第一個GET的then內部調用並使用模板字符串。 像這樣：

const getMyStuff = new Promise((resolve, reject) => { 
    axios.get('https://jira.example.co.uk/rest/api/2/project/PAD/versions', headers) 
    .then((response) => { 
     const versionID = response.data.map(({ id }) => id); 

     axios.all([ 
     axios.get(`https://jira.example.co.uk/rest/api/2/search?jql=project = 10005 AND fixVersion = ${versionID} ORDER BY priority DESC, key ASC`, headers), 
     axios.get(`https://jira.example.co.uk/rest/api/2/search?jql=status IN (Reported) AND project = 10005 AND fixVersion = ${versionID} ORDER BY priority DESC, key ASC`, headers), 
     axios.get(`https://jira.example.co.uk/rest/api/2/search?jql=status IN (Confirmed) AND project = 10005 AND fixVersion = ${versionID} ORDER BY priority DESC, key ASC`, headers), 
     ]) 
     .then(resolve) 
     .catch(reject) 
    }) 
    .catch(reject); 
}); 

getMyStuff() 
    .then((...args) => console.log(args)) 
    .catch((err) => console.error(err)); 

另外，您可以使用async/await把它清理乾淨多一點。 爲此，我想請你參考this video by MPJ，其中探討了async/await的基本概念。

Answer 3

axios.get('https://jira.example.co.uk/rest/api/2/project/PAD/versions', headers) 
.then(function(response) { 
    const versionID = response.data.map(function(version){  
     const vId = version.id; 

     return vId; 
    }); 

    getAnotherRequest(versionID); 
    }) 
    .catch(err => { 
     console.error(err, err.stack); 
    }); 


getAnotherRequest(versionID){ 
    axios.all([ 
     axios.get(`https://jira.example.co.uk/rest/api/2/search?jql=project = 10005 AND fixVersion = ${versionID} ORDER BY priority DESC, key ASC`, headers), 
     axios.get(`https://jira.example.co.uk/rest/api/2/search?jql=status IN (Reported) AND project = 10005 AND fixVersion = ${versionID} ORDER BY priority DESC, key ASC`, headers), 
     axios.get(`https://jira.example.co.uk/rest/api/2/search?jql=status IN (Confirmed) AND project = 10005 AND fixVersion = ${versionID} ORDER BY priority DESC, key ASC`, headers) 
    ]) 
    .then(axios.spread(function (response1, response2, response3) { ... } 
} 

但檢查您的versionID它是一個數組，而不是一個整數，因爲它是map結果和map結果是一個數組。