axios怎么在调用一个接口后紧接着掉第二个接口？

Question

1.我现在想调用一个接口后，紧接着用第一个接口的值调用第二个接口，正确的写法是这样的吗？

2.连着写then，最后的catch是取谁的？

Answer 1

用async/await吧，解决嵌套回调调用，更优雅一点。

Answer 2

写是可以这么写。但是返回的顺序还是不一定的。并不能保证第二个then的回调就一定第一个then之后返回。

所以呢，如果你一定要保证在拿到第一个then的返回后再去发送第二次请求，在现有技术的条件下可以这样

axios.get('url')
.then(res => {
    // todo
    axios.get('url2').then()
})

你要觉得这样写难看，可以自己封装下嘛，大致是这样

function axiosGet(url, param, cb) {
    if (typeof param === 'function') {
        cb = param
        param = ''
    }
    axios.get(url + param).then(res => {
        if (cb) { cb(res) }
    })
}

axiosGet('url1', function(res) {
    // todo
    axiosGet('url2', function(res) {
        // todo
    })
})

Answer 3

axios.get(url1).then(rsp => {
    //...
    return axios.get(url2)
}).then(rsp => {
    //...
    return axios.get(url3)
})

Answer 4

正确不正确你一试便知，另外只要有其中一个报错就会catch到，不针对其中某一个

Answer 5

你可以使用async做流程控制

# 安装方式
npm install async --save

题主的问题适合用：waterfall(tasks, [callback])

waterfall方法用于依次执行多个方法，一个方法执行完毕后才会进入下一方法，waterfall的多个方法只能以数组形式传入，不支持object对象。前一个函数的输出做为下一个函数的输入参数

代码示例

async.waterfall([
    function(callback) {
        callback(null, 1);
    },
    function(arg1, callback) {
        console.log(arg1); // 1
        callback(null, 2);
    }
], function (err, result) {
    // 执行的任务中方法回调err参数时，将被传递至本方法的err参数
    // 参数result为最后一个方法的回调结果'done'
    console.log(result) // 2
});

Answer 6

以上给出的方法都很丰富了，我再补充一个个人习惯使用的方法吧，那就是使用 Promise.all,实例如下：

Promise.all([
    axios.get(url1),
    axios.get(url2)
]).then(res => {})
.catch(err => {});

这样其中任何一个请求出错，catch就会执行。