526互联

vue:el-table在resize时报错(element-plus@2.3.12)

发布时间 2023-09-30 16:17:58作者: 刘宏缔的架构森林

一，报错信息:

Uncaught runtime errors:
×
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)

如图:

二，原因和解决

el-table在resize时如果项目中定义了resize代码，会触发此问题，

我们给它的样式增加一个高度的指定

解决:

1
2
3
4
5
6
7
<el-table
      :data="tableData"
      border
      row-key="UserId"
      stripe
      style="width: 100%;height:100%;"
  >

给el-table增加了一个高度100%的样式

三，查看效果:

表格可以正常显示了:

说明：刘宏缔的架构森林—专注it技术的博客，
网站：https://blog.imgtouch.com
原文: https://blog.imgtouch.com/index.php/2023/09/30/vue-eltable-zai-resize-shi-bao-cuo-elementplus-2-3-12/
代码: https://github.com/liuhongdi/ 或 https://gitee.com/liuhongdi
说明：作者:刘宏缔 邮箱: 371125307@qq.com

四，查看vue框架/element-plus的版本:

liuhongdi@lhdpc:/data/vue/responsive$ npm list vue
responsive@0.1.0 /data/vue/responsive
└─┬ vue@3.3.4
  └─┬ @vue/server-renderer@3.3.4
    └── vue@3.3.4 deduped
liuhongdi@lhdpc:/data/vue/responsive$ npm list element-plus
responsive@0.1.0 /data/vue/responsive
└── element-plus@2.3.12