Vue 学习笔记 错误ResizeObserver loop completed with undelivered notifications

环境Vue3 Ts

使用了el-table 后,容易出现如下错误

ERROR

ResizeObserver loop completed with undelivered notifications.

at handleError (webpack-internal:///./node_modules/webpack-dev-server/client/overlay.js:299:58)

at eval (webpack-internal:///./node_modules/webpack-dev-server/client/overlay.js:318:7)

解决办法

在App.vue 下面加代码

javascript 复制代码
const debounce = (callback: (...args: any[]) => void, delay: number) => {
      let tid: any;
      return function (...args: any[]) {
        const ctx = self;
        tid && clearTimeout(tid);
        tid = setTimeout(() => {
          callback.apply(ctx, args);
        }, delay);
      };
    };

    const _ = (window as any).ResizeObserver;
    (window as any).ResizeObserver = class ResizeObserver extends _ {
      constructor(callback: (...args: any[]) => void) {
        callback = debounce(callback, 20);
        super(callback);
      }
    };
  },

App.vue 完整代码如下:

javascript 复制代码
<template>
  <div id="app">
    <router-view />
  </div>
</template>
<script lang="ts">
import { defineComponent } from "vue";

export default defineComponent({
  setup() {
    const debounce = (callback: (...args: any[]) => void, delay: number) => {
      let tid: any;
      return function (...args: any[]) {
        const ctx = self;
        tid && clearTimeout(tid);
        tid = setTimeout(() => {
          callback.apply(ctx, args);
        }, delay);
      };
    };

    const _ = (window as any).ResizeObserver;
    (window as any).ResizeObserver = class ResizeObserver extends _ {
      constructor(callback: (...args: any[]) => void) {
        callback = debounce(callback, 20);
        super(callback);
      }
    };
  },
});
</script>
<style lang="scss"></style>

为什么??? 我也不清楚原理

ChatGPT 解释如下:

相关推荐
哆啦A梦15881 小时前
搜索页面布局
前端·vue.js·node.js
_院长大人_2 小时前
el-table-column show-overflow-tooltip 只能显示纯文本,无法渲染 <p> 标签
前端·javascript·vue.js
SevgiliD2 小时前
el-table中控制单列内容多行超出省略及tooltip
javascript·vue.js·elementui
Main. 242 小时前
从0到1学习Qt -- 创建第一个Hello World项目
学习
壹号用户2 小时前
python学习之生成器&三者关系
学习
new coder2 小时前
[c++语法学习]Day10:c++引用
开发语言·c++·学习
星域智链3 小时前
宠物智能用品:当毛孩子遇上 AI,是便利还是过度?
人工智能·科技·学习·宠物
ajsbxi3 小时前
【Java 基础】核心知识点梳理
java·开发语言·笔记
哆啦A梦15883 小时前
axios 的二次封装
前端·vue.js·node.js
阿珊和她的猫3 小时前
深入理解与手写发布订阅模式
开发语言·前端·javascript·vue.js·ecmascript·状态模式