vue3: 报错ResizeObserver loop completed with undelivered notifications.解决方法

最新推荐文章于 2024-04-29 21:35:15 发布
最新推荐文章于 2024-04-29 21:35:15 发布
阅读量387 收藏 5
点赞数 8
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/g2526/article/details/137841367
版权

错误提示：

组件重新绘制大小时dev环境出现报错提示，如在VUE3中使用ant-design-vue表格自适应窗口大小时webpack会报错。

常用解决方案有重写ResizeObserver或者时间间隔内限制执行方式，可以设置屏蔽方式跳过提示。

解决办法：

修改配置vue.config，在module.exports中增加

devServer: {
      
        client: {
            overlay: false
        },
},

重新运行后就不会有提示了

_Eolin
关注
  • 8
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue-response-components-使用ResizeObserver创建响应组件。-Vue.js开发
05-27
想法看看我在ITNEXT安装上的帖子npm install vue-response-components（可选）从“ vue”全局导入插件vue从“ vue-response-components”导入{VueResponsiveComponents} Vue.use（VueResponsiveComponents）它将添加...
报错解决：ResizeObserver loop completed with undelivered notifications
曈欣的博客
02-29 2520
切换路由的时候，会报上面的错误。看了些文章说是因为 element-plus 的 el-table引起的，我正好也用了。中加入以下这段代码即可解决：app.vue写在script里面 main.js写在app挂在完之后。
VUE3中，使用ant-design-vue表格滚动报错ResizeObserver loop completed with undelivered notifications.
lss_033_lss的博客
04-24 295
ResizeObserver解决方法
在vue3中使用element-plus页面重置报ResizeObserver loop completed with undelivered notifications.
qq_59502044的博客
08-07 6223
在vue3中使用element-plus页面重置报错ResizeObserver loop completed with undelivered notifications.
element中表格报错 ResizeObserver loop completed with undelivered notifications.
shanins的博客
04-09 8319
emm就是 想使用饿了么UI的那个流体表格 但是拿过来用一直报这个错 关掉发现也可以用 但是就是会每次调试都打开这么一个报错 然后发现把Max-height改成height就行了 改成这样子就不会报错了
Vue 报错TypeError: this.$set is not a function 的解决方法
10-17
主要介绍了Vue 报错TypeError: this.$set is not a function 的解决方法，分享给大家，需要的朋友们下面随着小编来一起学习学习吧
Vue.js报错Failed to resolve filter问题的解决方法
10-22
主要介绍了Vue.js报错Failed to resolve filter问题的解决方法,需要的朋友可以参考下
vue.js 中使用（…）运算符报错的解决方法
12-10
今天在起别人项目的时候， 发现报错。 这个错误是，项目中不识别es6的扩展运算符， 解决方式很简单。 // 第一步 cnpm install babel-plugin-transform-object-rest-spread // 第二步 看一下你的 .babelrc 里面是否...
element-ui的bug记录
最新发布
nick_zhang的博客
04-29 275
7.el-dialog组件在关闭时，会触发子组件的created/mounted生命周期。原因是当visible改变为false，即关闭dialog的时候，如果用户设置了destroyOnClose=true，则执行key++；key是绑定在较外层的div上的，key值的变化会导致这个div重新渲染。6.select 的 popper-append-to-body ,默认值为true;dialog的append-to-body,默认值为false;3.element表格前端分页。
三、VUE数据代理
D_A_I_H_A_O的博客
04-29 364
Vue中的数据代理：通过vm对象来代理data对象中属性的操作（读/写）
vue+element 树形结构 改成懒加载模式(原理element有),这里只做个人理解笔记
xu_duo_i的博客
04-25 400
vue+element 树形结构 改成懒加载模式(原理element有),这里只做个人理解笔记
vue 快速入门 系列 —— 玩转 CMS
ZL4120505的博客
04-29 699
例如 src/layouts/BasicLayout.less，里面包含一些基本布局的样式，被 src/layouts/BasicLayout.vue 引用，项目中使用这种布局的页面就不需要再关心整体布局的设置。好比中医发展了好几千年，许多本源的东西老中医也是不清楚的，但我们摸索出一套规则，按照这个能治病，这个就很好。.clearfix() 混合器定义了清除浮动的样式。组件相关的样式，有一些在页面中重复使用的片段或相对独立的功能，你可以提炼成组件，相关的样式也应该提炼出来放在组件中，而不是混淆在页面里。
vue报错：Do not mutate vuex store state outside mutation handlers.
weixin_44021888的博客
04-25 320
vue报错：Do not mutate vuex store state outside mutation handlers.
el-tree 或 el-tree-select 根据条件，控制节点的显示隐藏
IT_dabai的博客
04-25 299
要求el-tree-select 的节点根据节点数据状态来进行显示隐藏（状态字段为status，显示：‘1’，隐藏：‘0’）
vue3 element ui plus 登录(本人空间有源码下载)
qq_34417247的博客
04-29 780
登录
Vue 组件分类、局部注册和全局注册
zsx0728的博客
04-26 362
组件分为根组件与普通组件，本文用案例介绍了局部注册和全局注册。
vue中@click.prevent函数的使用
qq_42476938的博客
04-26 270
有些标签属性自带了事件，但我们有时并不需要那些事件，因此就需要阻止默认事件，只执行我们绑定的事件。@click.prevent就可以帮我们实现这个效果。
vue3【详解】vue3 比 vue2 升级了哪些重要的功能?
朝阳39的博客
04-27 938
vue2 使用 new Vue() 初始化实例vue3 使用 Vue.createApp() 初始化实例。
vue3中使用anrd表格报错ResizeObserver loop completed with undelivered notifications.
01-24
在vue3中使用anrd表格报错"ResizeObserver loop completed with undelivered notifications"是由于ResizeObserver循环触发导致的。这个错误通常发生在表格组件中，当表格的大小发生变化时，ResizeObserver会不断触发回调函数，但是由于某些原因导致回调函数无法及时处理完毕，从而引发了这个错误。 解决这个问题的方法是使用防抖函数对ResizeObserver的回调函数进行包装。防抖函数可以延迟回调函数的执行，确保在一段时间内只执行一次。这样可以避免回调函数被频繁触发，从而解决了"ResizeObserver loop completed with undelivered notifications"错误。 以下是一个示例代码，演示了如何在vue3中使用防抖函数解决这个问题： ```javascript // 在main.js中引入防抖函数 import { createApp } from 'vue' import App from './App.vue' const app = createApp(App) // 在app.vue中使用防抖函数包装ResizeObserver的回调函数 const debounce = (fn, delay) => { let timer = null; return function () { let context = this; let args = arguments; clearTimeout(timer); timer = setTimeout(function () { fn.apply(context, args); }, delay); } } const _ResizeObserver = window.ResizeObserver; window.ResizeObserver = class ResizeObserver extends _ResizeObserver { constructor(callback) { callback = debounce(callback, 16); super(callback); } } app.mount('#app') ``` 通过以上代码，我们将ResizeObserver的回调函数使用防抖函数进行包装，延迟执行时间设置为16毫秒。这样就能够解决"ResizeObserver loop completed with undelivered notifications"错误。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值