美文网首页
react中axios取消请求

react中axios取消请求

作者: 太空蛙 | 来源:发表于2022-04-23 22:44 被阅读0次

常规的axios取消请求方式:

v0.22.0及之后版本
const controller = new AbortController();

axios.get('/user/12345', {
   signal: controller.signal
}).then(function(response) {
   //处理错误
});
// 取消请求
controller.abort()
v0.22.0之前版本
const CancelToken = axios.CancelToken;
const source = CancelToken.source();

axios.get('/user/12345', {
  cancelToken: source.token
}).catch(function (thrown) {
  // 处理错误
});

// 取消请求(message 参数是可选的)
source.cancel('Operation canceled by the user.');
针对post请求并且设置了onUploadProgress的情况,上述代码不起作用,需要用useState
const [controller, setController] = useState(new AbortController());

axios.get('/user/12345', {
   signal: controller.signal
}).then(function(response) {
   //处理错误
});
// 取消请求
controller.abort()
//解决下次不能发请求问题
setController(new AbortController())

相关文章

  • react中axios取消请求

    常规的axios取消请求方式: v0.22.0及之后版本 v0.22.0之前版本 针对post请求并且设置了onU...

  • axios如何取消接口请求

    vue项目,如何在axios中取消已经发送的请求呢? 原生js的abort()这个方法 在axios中取消接口请求...

  • Axios中取消请求

    在平时的开发过程中,我们会经常遇到菜单切换的问题,在一些切换频率较低的情况下,在切换到另一个页面的时候,上一个页面...

  • react 离开页面 axios 取消请求

  • axios 取消请求

    axios文档里介绍的取消axios请求有以下两种方式: 举?:切换路由时,取消上个路由的请求。 其实我们的解决方...

  • axios取消请求?

    前言 最近在项目中遇到一个问题,在连续发送同一请求时,如果第二次请求比第一次请求快,那么实际显示的是第一次请求的数...

  • 防止发起多余http请求的几种方式

    cancelToken 场景: 请求接口数据量过大,结果未返回需要取消接口pending用法:axios取消请求的...

  • React中的“ajax”

    React没有ajax模块 集成其他的js库(如axios/fetch/jquery),发送ajax请求axios...

  • 问题总结

    1. 取消axios请求 业务场景:单页应用,希望退出当前页的时候,取消请求 官网: https://github...

  • React中的数据请求

    React中的数据请求 xhr jQuery中的$.ajax axios fetch fetch是ES6提供的一个...

网友评论

      本文标题:react中axios取消请求

      本文链接:https://www.haomeiwen.com/subject/oxuxyrtx.html