页面多个请求全局loading如何控制

Question

一个页面的渲染通常涉及到多个请求，当只有一个请求时，我们可以在请求的拦截方法中来控制isShowLoading这个状态，比如：

var isShowLoading = false

service.interceptors.request.use(config => {
  // Do something before request is sent
  isShowLoading = true
  return config
}, error => {
  // Do something with request error
})

service.interceptors.request.use(response => {
  // Do something after request is returned
  isShowLoading = false
  return response
}, error => {
  // Do something with request error
})

如果涉及到同时多个请求呢？难道是将isShowLoading变为一个对象，每一次请求都往对象里面存键值对，当所有值都为true的时候才关闭？有没有其他的方法？

Answer 1

比较简单的方法是把变量类型从boolean换成number
request请求变量+1，收到回调变量-1; Loading逻辑改成变量非0显示