Question

我在视图中有不同的反应模块，而每个模块都通过axios调用API。转到另一个视图时，所有呼叫应被取消。但是，返回到此视图时，应重新启动呼叫（这些呼叫在componentDidMount()中）。

文件AxiosCancellation.js：

import axios from 'axios';
let cancel;
export var cancelRequest = (message) => {
  if (cancel) cancel(message);
};
export var setCancelToken = (c) => {
  cancel = c;
};
export var CancelToken = axios.CancelToken;

文件2：

import {CancelToken, setCancelToken} from "AxiosCancellation";
export var get1: () => {
  return axios.get('/get1', {
    cancelToken: new CancelToken(function executor(c) {
      setCancelToken(c);
    })
  }).then(handleResponse);
}

文件3：

import {CancelToken, setCancelToken} from "AxiosCancellation";
export var get2: () => {
  return axios.get('/get2', {
    cancelToken: new CancelToken(function executor(c) {
      setCancelToken(c);
    })
  }).then(handleResponse);
}

当我现在单击导航栏上的链接时呼叫cancelRequest()时，只有一个呼叫被取消。如何取消多个呼叫（位于不同文件中）？

Answer 1

尝试使用此lib axios-tx

只需确保您对所有相关调用使用相同的实例（应一起取消）

使用相同的CancelToken取消多个axios请求

1 个答案: