开发中遇到需要取消请求的功能，，点击终止查询可以取消开始查询请求，再次点击开始查询又可以进行查询。

解决方法：axios官方文档上的CancelToken，一开始用了这个api后，可以成功取消请求，但是再次点击开始查询请求一直失败。原因是因为cancelToken始终没变导致每次点击终止查询调用cancel()方法取消的都是一个cancelToken，所以再次请求的时候会请求失败。所以每次点击开始查询要传一个新的cancelToken，可以参考这个demo：https://codepen.io/dashtinejad/pen/Lxejpq?editors=1011，把Network的网速调成slow 3G测试

axios 取消请求的方法的更多相关文章

  1. axios 取消请求

    解决思路 在发送第二次请求的时候如果第一次请求还未返回,则取消第一次请求,以保证后发送的请求返回的数据不会被先发送的请求覆盖. axios官方文档取消请求说明 方法一: const CancelTok ...

  2. Android OkHttp + Retrofit 取消请求的方法

    本文链接 前言 在某一个界面,用户发起了一个网络请求,因为某种原因用户在网络请求完成前离开了当前界面,比较好的做法是取消这个网络请求.对于OkHttp来说,具体是调用Call的cancel方法. 如何 ...

  3. axios 取消请求 （如：用户登录失效，阻止其他请求）

    const CancelToken = axios.CancelToken; const source = CancelToken.source(); axios.interceptors.reque ...

  4. jq和axios的取消请求

    场景: 分页: 每次点击分页会发送请求,如果上一次请求还未获取到,下一次请求已经开始且先一步获取到,那么数据上会出现问题. 快速点击会发送多次请求,多次点击的时候一般的做法我们会定义一个flag,此时 ...

  5. axios取消接口请求

    axios取消请求 这里就是分析一下接口请求需要被取消时的一些操作 因为我是用vue写的项目,所以标配用的是axios,怎么在axios中取消已经发送的请求呢? 1.在这之前我们还是先介绍一下原生js ...

  6. 学习axios必知必会（2）~axios基本使用、使用axios前必知细节、axios和实例对象区别、拦截器、取消请求

    一.axios的基本使用: ✿ 使用axios前必知细节: 1.axios 函数对象(可以作为axios(config)函数使用去发送请求,也可以作为对象调用方法axios.request(confi ...

  7. Axios 取消 Ajax 请求

    Axios 取消 Ajax 请求 Axios XMLHttpRequest https://caniuse.com/?search=XMLHttpRequest https://developer.m ...

  8. vue2.0项目实战（3）使用axios发送请求

    在Vue1.0的时候有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource. 关于为什么放弃推荐? -> 尤 ...

  9. Vue笔记：使用 axios 发送请求

    在Vue1.0的时候有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource. 关于为什么放弃推荐? -> 尤 ...

随机推荐

  1. 编译时bad substitution的解决办法

    由于使用的使用的编译器不同导致, 需要使用shell为 #!/bin/bash 即可.

  2. apache服务器的常用功能及设置

    安装httpd yum -y install  httpd     服务脚本:/etc/rc.d/init.d/httpd        脚本配置文件:/etc/sysconfig/httpd     ...

  3. 通达OA系统myisam转innodb引擎

    OA系统切换到linux环境后,性能提升了2-3倍左右,随着公司的发展壮大,办公人员也会越来越多,当人数达到一定数量级别时如1500在线人数已无法支撑公司业务,就需要对系统进行性能提升优化. 当前OA ...

  4. 【可视化】DataV接入ECharts图表库 可视化利器强强联手

    DataV接入ECharts图表库 可视化利器强强联手 摘要: 两个扛把子级产品的结合,而且文末有彩蛋. DataV 数据可视化是搭建每年天猫双十一作战大屏的幕后功臣,ECharts 是广受数据可视化 ...

  5. 队列queue 代码

    import queue q=queue.Queue(3) #队列:先进先出 q.put(1) q.put(2) q.put(3) q.put(4) print(q.get()) print(q.ge ...

  6. 【前端】三个bug

    目录 一.Array对象的indexOf() 二.使用jquery,clone()下拉框问题 三.jquery获取获取html5的data-*属性 一.Array对象的indexOf() 1.inde ...

  7. graphql详解

    随着系统业务量的增大不同的应用和系统共同使用着许多的服务api,而随着业务的变化和发展,不同的应用对相同资源的不同使用方法最终会导致需要维护的服务api数量呈现爆炸式的增长,比如我试着跑了下我们自己业 ...

  8. python 全栈开发，Day82(点赞和踩灭,用户评论)

    一.点赞和踩灭 样式 先来做样式,修改article_detail.html,增加div_digg的div {% extends "base.html" %} {% block c ...

  9. bind函数详解(转)

    var name = "The Window"; var object = { name: "My Object", getNameFunc: function ...

  10. LINQ学习之旅（三）

    Linq to Sql语句之Join和Order By Join操作 适用场景:在我们表关系中有一对一关系,一对多关系,多对多关系等.对各个表之间的关系,就用这些实现对多个表的操作. 说明:在Join ...