vue, 调用接口时存入数组，路由跳转时取消所有正在进行的接口请求

在Vue项目中，当调用接口并希望在路由跳转时自动取消所有未完成的接口请求时，你可以采用以下策略：

1. **全局状态管理**：
- 使用Vuex（状态管理模式）来存储所有进行中的请求。每当发起一个新的请求时，将请求对象添加到状态的一个数组中。例如，创建一个`actions.js`文件来处理异步操作：

     export const fetchData = ({ commit }, url) => {
       commit('START_REQUEST', url);
       const response = axios.get(url).then(data => {
         commit('SUCCESS_REQUEST', data);
       }).catch(error => {
         commit('FAILURE_REQUEST', error);
       });
       return response.finally(() => {
         commit('CANCEL_REQUEST', url); // 请求完成后从数组中移除
       });
     };

- 在`mutations.js`中定义对应的更新动作（mutation），同时在`state.js`中初始化一个空数组用于存储请求。

2. **路由守卫**：
- 使用`beforeRouteUpdate`或`beforeRouteLeave`路由守卫，在导航离开当前路由时检查是否有未完成的请求。如果有的话，遍历并取消它们：

     import { mapActions } from 'vuex';
     
     export default {
       beforeRouteUpdate(to, from, next) {
         if (to.meta.isNotNeedCancelRequest !== true) { // 如果不需要取消，则直接进入下一个路由
           const actions = mapActions(['cancelAllRequests']);
           actions.cancelAllRequests(); // 调用取消所有请求的操作
           next();
         } else {
           next();
         }
       }
     };

3. **axios插件**：
- 使用axios的全局中间件取消器，如`axios-cancel-until-route-change`，它会在路由变化时自动取消所有请求。

总之，通过结合状态管理、路由守卫以及可能的第三方插件，你可以有效地管理Vue应用中在路由跳转时需要取消的接口请求。