title: Cancel several axios requests with same CancelToken
body: <p>I have different react modules in a view, while each is calling an API via <code>axios</code>. When going to another view, all calls should be cancelled. However, when returning to this view, the calls should be started again (those are in <code>componentDidMount()</code>).</p>
  
  <p>File <code>AxiosCancellation.js</code>:</p>
  
  <pre><code>import axios from 'axios';
  let cancel;
  export var cancelRequest = (message) =&gt; {
    if (cancel) cancel(message);
  };
  export var setCancelToken = (c) =&gt; {
    cancel = c;
  };
  export var CancelToken = axios.CancelToken;
  </code></pre>
  
  <p>File 2:</p>
  
  <pre><code>import {CancelToken, setCancelToken} from "AxiosCancellation";
  export var get1: () =&gt; {
    return axios.get('/get1', {
      cancelToken: new CancelToken(function executor(c) {
        setCancelToken(c);
      })
    }).then(handleResponse);
  }
  </code></pre>
  
  <p>File 3:</p>
  
  <pre><code>import {CancelToken, setCancelToken} from "AxiosCancellation";
  export var get2: () =&gt; {
    return axios.get('/get2', {
      cancelToken: new CancelToken(function executor(c) {
        setCancelToken(c);
      })
    }).then(handleResponse);
  }
  </code></pre>
  
  <p>When I now call <code>cancelRequest()</code> when clicking a link on the navbar, only one call is cancelled. How can I cancel multiple calls (that are in different files)?</p>