防抖函数--应用场景及示例

防抖函数--应用场景及示例

1.当短时间内出现多次调用同一个东西的时候-可以使用

场景1

接口多次相应401--但是只需要提醒一次

javascript 复制代码
//time 为全局变量
let time;


axios.interceptors.response.use(
  function (response) {
    if (response.data.code === 401) {
      //当401时清除缓存信息
     
        // Message.error(response.data.msg);
      
        //搞个节流函数--------------此处为防抖函数
        let flagT = false;
        clearTimeout(time);
        time = setTimeout(() => {
          flagT = true;
          if (flagT) {
            Message.error(response.data.msg);
          }
        }, 500);
      // 重定向到登录页
      router.replace({
        path: "/",
      
      });
      return;
    }

    return response;
  },
  function (error) {
    // 对响应错误做点什么
    // loadingInstance.close();
    return Promise.reject(error);
  }
);

场景2

还有一个场景用的比较多 --随窗口大小变化--更改echrts的大小这个经常会用到--与上边代码同理

诸君有用且点赞

相关推荐
kyriewen1 天前
折腾了半年 AI 编程工作流,最后发现效率瓶颈是桌上那块屏幕
前端·javascript·ai编程
蜗牛前端1 天前
codex 全流程开发上线的高颜值礼簿小程序
前端·微信小程序
大龄秃头程序员1 天前
我在图文流 App 里落地双层缓存、弱网降级与 OOM 治理
前端
老王以为1 天前
React Renderer 分离的多平台架构
前端·react native·react.js
hunterandroid1 天前
Kotlin Coroutines 与 Flow:让异步任务更清晰
前端
Bigger1 天前
从零搭建 AI 代码审查服务:一份前端也能看懂的 Python 学习笔记
前端·ci/cd·ai编程
lichenyang4531 天前
JSAPI、NAPI、Biz、Imp:ASCF Demo 如何真正调用系统能力和 C++ 能力
前端
lichenyang4531 天前
IPC、JSVM、UIThread、libuv:ASCF 架构图里最容易混的几个词
前端
用户059540174461 天前
Redis记忆存储故障恢复测试踩坑实录:手动测试让我漏掉了2个一致性Bug
前端·css
用户2136610035721 天前
Vue2脚手架工程化与Axios集成
前端·vue.js