config.cancelToken.throwIfRequested is not a function

[max-capricorn]

Describe the issue

why like this?
Uncaught (in promise) TypeError: config.cancelToken.throwIfRequested is not a function
at throwIfCancellationRequested (dispatchRequest.js?5270:13)
at dispatchRequest (dispatchRequest.js?5270:24)

Example Code

Code snippet to illustrate your question

export const Http = axios.create({
  baseURL: process.env.VUE_APP_BASE_API || '/',
  withCredentials: true,
  timeout: 20000,
  transformResponse: [
    function (data) {
      return JSONBigString.parse(data);
    }
  ]
});
const CancelToken = axios.CancelToken;
//请求拦截
Http.interceptors.request.use(async (config) => {
  const source = CancelToken.source();
  config.cancelToken = source
  if (!store.getters.token) {
    source.cancel()
  } else {
    let tokenStr = "Bearer " + store.getters.token;
    config.headers.Authorization = tokenStr;
    Toast.loading({
      message: '加载中...',
      forbidClick: true,
    });
  }
  return config
});

Expected behavior, if applicable

this's question to be resolved

Environment

• Axios Version [0.21.2]
• Adapter [e.g. XHR/HTTP]
• Browser [e.g. Chrome, Safari]
• Browser Version [e.g. 22]
• Node.js Version [e.g. 13.0.1]
• OS: [e.g. iOS 12.1.0, OSX 10.13.4]
• Additional Library Versions [e.g. React 16.7, React Native 0.58.0]

Additional context/Screenshots

Add any other context about the problem here. If applicable, add screenshots to help explain.

[hanischandrew]

config.cancelToken = source should be config.cancelToken = source.token

Here is a link explaining it a bit further https://masteringjs.io/tutorials/axios/cancel