vue中的.then()与.catch()

vue中的.then()与.catch()

本文意在解读vue axios请求时常用的.then()与.catch()

.then()

在axios请求完成后执行的下一步操作（异步执行），包括两个参数

axios.post(url, data)
   .then(res => {
      console.log(res);//第一个参数：成功后返回结果
   }, error => {
      console.log(error);//第二个参数：请求失败后返回值
   })

.catch()

在.then()中代码逻辑出错、请求失败等的回调函数，防止因代码造成程序崩溃，这里的方法类似于try{}.catch(e){}，省略了try{}

 axios.post(url, data)
    .then(data => {
        console.log(data)
    })
    .catch(err => {
        console.log(err)//代码错误、请求失败捕获
    })

总结

catch中获取到的值是请求失败或者代码问题造成的错误，而因代码造成的错误在.then()中获取不到，因此我们常用catch
我们偶尔会遇到一些问题：明明请求成功了，逻辑却进入catch中了，这时说明在then中的处理逻辑可能出现了错误，并不是请求失败才会进入catch