axios成功和失败的两个函数?

简介: axios成功和失败的两个函数?

在Axios中,当你发送一个请求时,你可以通过.then().catch()链式调用或者通过async/await语法来分别处理请求成功和失败的情况。

使用.then().catch()时,成功的响应会传递给.then()中的函数,而任何错误或异常都会被.catch()捕获。

以下是一个使用.then().catch()的例子:

javascript复制代码

axios.get('/api/somepath')
.then(function (response) {
// 请求成功时执行的函数
console.log(response.data);
})
.catch(function (error) {
// 请求失败时执行的函数
console.error(error);
});

使用async/await时,你可以使用try...catch结构来处理成功和失败的情况。await关键字会等待Promise解决(即请求成功),并将结果赋值给后面的变量。如果Promise被拒绝(即请求失败),则会抛出异常,这个异常会被catch块捕获。

以下是一个使用async/await的例子:

javascript复制代码

async function fetchData() {
try {
const response = await axios.get('/api/somepath');
// 请求成功时执行的代码
console.log(response.data);
} catch (error) {
// 请求失败时执行的代码
console.error(error);
}
}
fetchData();

在上面的两个例子中,成功的响应都被打印到了控制台,而任何错误都被捕获并打印为错误。在实际应用中,你可能需要根据响应或错误的具体内容来执行不同的操作。

相关文章
|
2月前
|
前端开发 API
Axios请求成功和失败时分别执行哪个函数?
Axios请求成功和失败时分别执行哪个函数?
48 1
|
2月前
|
前端开发
Axios请求成功和失败时分别执行哪个函数?
Axios请求成功和失败时分别执行哪个函数?
数据交互,前后端数据请求,axios请求,对象结构的使用,E6的使用,结构赋值是什么?函数形参的obj如何,函数形参的obj就改成对象结构接收传入的数据对象
数据交互,前后端数据请求,axios请求,对象结构的使用,E6的使用,结构赋值是什么?函数形参的obj如何,函数形参的obj就改成对象结构接收传入的数据对象
|
2月前
|
前端开发
AJAX发送请求方法封装和请求函数底层刨析以及axios二次封装
AJAX发送请求方法封装和请求函数底层刨析以及axios二次封装
|
2月前
|
存储 JSON 缓存
【源码共读】axios的46个工具函数
【源码共读】axios的46个工具函数
117 0
|
前端开发 JavaScript Sentinel
我发现了axios源码工具函数中的一个小bug
最开始我一看很蒙蔽,很多时候自己并不会去写这样的函数,说白了还是自己代码底子不行。可能很多大佬一看就明白了,所以基础很重要,基础很重要,基础很重要。箭头函数算是ES6中新增的。
78 0
|
前端开发
【Vue3从零开始-实战】S9:封装axios请求函数
【Vue3从零开始-实战】S9:封装axios请求函数
294 0
【Vue3从零开始-实战】S9:封装axios请求函数
|
2月前
|
JavaScript
vue封装axios(用interceptors封装)
vue封装axios(用interceptors封装)
30 0
|
2月前
|
JSON 前端开发 JavaScript
3分钟让你学会axios在vue项目中的基本用法(建议收藏)
3分钟让你学会axios在vue项目中的基本用法(建议收藏)
267 0
|
5天前
|
前端开发 JavaScript 数据库
vue 使用 async 和 await 实现异步 axios 同步化(实战案例:数据异步校验通过后,再执行保存)
vue 使用 async 和 await 实现异步 axios 同步化(实战案例:数据异步校验通过后,再执行保存)
10 1