如何在另一个axios中使用axios响应获取React JS?

问题描述:

目前我需要在下一个axios get中使用axios响应。如何在另一个axios中使用axios响应获取React JS?

首先得到:

第一个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) { ... } 

我将如何实现这一目标?

+0

第二次请求何时触发? – Andrew

+0

第一次请求后 –

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电话,然后获得响应。

实现此目的的一种方法是只在第一个GETthen内部调用并使用模板字符串。 像这样:

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的基本概念。

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结果是一个数组。