如何在react axios拦截器中全局显示“加载中”状态

Question

尝试用了antd-mobile中的Toast，但我这个是PC网页端的，效果并没有加载出来。

import Axios from 'axios'

Axios.interceptors.request.use(function (config) {
  // 显示“加载中”状态
  const token = window.localStorage.token;
  if (token) {
     config.headers.Authorization = `token ${token}`
  }
  return config
}, function (error) {
  return Promise.reject(error);
});

Axios.interceptors.response.use(function (response) {
  // 隐藏“加载中”状态
  return response;
}, function (error) {
  return Promise.reject(error);
});

Answer 1

拦截器里面的全局加载，需要考虑一个问题，那就是一个页面可能会有很多接口请求，如果像你这么写会造成loading闪烁或者一个接口完成后就loading结束 , 所以你需要设置一个全局变量统计一个接口数量， 当所有的接口返回的时候loading才消失

Answer 2

这个不应该放在axios拦截器里，应该在componentDidMount下用 Promise.all

Answer 3

请问这个问题解决了吗？？同求