关于Vue路由切换时中断上一个路由请求情况的处理

开篇闲话

前两天做项目的时候遇到一个问题，那就是路由切换了但是上一个路由的请求依旧继续执行，导致页面卡顿，以及新的请求和之前请求一块发送非常影响性能。就想到了axios中可以使用cancelToken可以用来中断请求，于是记录下来以备不时之需（小白学习，还有很多不足，希望大佬可以指正！）

1、首先，由于我们要在store中对请求进行状态管理所以要在store中管理取消的请求操作 Store/index.js

2、然后在对axios进行二次封装，设置请求（request）和响应（response）的处理操作

（不要忘了导入store和导出axios，新手常犯得错误）axios.js

最后一步，就是监听路由切换，在路由表中设置路由守卫对路由进行监听，在路由切换时对上一个路由的请求进行中断

进行路由切换测试，如果看到如下结果，则证明路由请求中断成功

我也是借鉴大佬的写法，中间摸索了好久，至于原理还是很懵，只是处于实现业务逻辑的阶段。希望可以帮助到遇到类似问题的小伙伴
加油呀！