多请求并发时统一控制加载状态的核心是“计数+延迟”：通过全局计数器管理请求数量，请求发起+1、完成（含失败/取消）-1，仅当归零且延时300ms后才关闭loading，并配合spin组件实现全局统一展示。
多请求并发时统一控制加载状态，核心是“计数+延迟”，不是简单开关。单个请求快进快出，直接 toggle loading 几乎不可见；多个请求交错响应，又容易提前关闭。得让 loading 状态真正反映“是否有请求在进行中”。
用请求计数器管理全局 loading
在状态管理（如 Pinia 或 Vuex）里维护一个 activeRequestCount 计数器，每次请求发起时 +1，完成（无论成功或失败）时 -1。只有当计数归零，才关闭 loading。
- 请求拦截器里：store.activeRequestCount++，并触发 loading = true（若之前为 0）
- 响应拦截器里：store.activeRequestCount--，并在计数为 0 时设置 loading = false
- 错误拦截器也要做减法，否则失败请求会卡住计数器
加最小显示时长避免闪动
即使所有请求 50ms 就返回，loading 也不该瞬间消失——用户根本看不到。在关闭 loading 前加一个 300ms 的最小延迟：
- 响应拦截器中不立即设 loading = false，而是启动 setTimeout
- 如果期间有新请求进来（计数 > 0），就清除定时器，保持 loading 开启
- 只有计数为 0 且定时器跑完，才真正关闭
配合 ant-design-vue 的 Spin 组件使用
Spin 不需要手动挂载，直接在 App.vue 或 Layout 组件顶层用 v-if 控制：
- loadingState 来自 store 或组合式 API 的 reactive 状态
- 不需要每个页面单独引入或控制，真正实现全局统一
注意并发场景下的边界情况
真实业务中还有几类容易漏掉的情况：
- 重复提交：按钮点击后立刻禁用，并在请求开始时置 loading，避免用户狂点触发一堆请求
- 缓存响应：浏览器从内存或 disk cache 返回数据，不会走完整网络流程，需确保拦截器仍能捕获（Axios 默认不拦截缓存响应，可加 cache: 'no-cache' 强制走网络）
- 取消请求：主动调用 cancel token 时，也要在拦截器中做计数减法，否则 loading 会一直挂着
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
