使用el-table组件，一直报ResizeObserver loop limit exceeded 错误

Question

问题描述

使用el-table组件，一直报js error: ResizeObserver loop limit exceeded 错误

问题出现的环境背景及自己尝试过哪些方法

相关代码

<el-table
    :data="tableData"
    :resizable="false"
    border
    style="width: 100%" >
    <template v-for="(item, index) in config.tableHeaders">
        <el-table-column  :key="index"
            :prop="item.key"
            :label="item.label"
            header-align="center">
        </el-table-column>
    </template>
</el-table>


window.onerror = function (errorMessage, scriptURI, lineNumber, columnNumber, error) {
    console.log(errorMessage);
};

你期待的结果是什么？实际看到的错误信息又是什么？

// 控制台输出的错误信息
ResizeObserver loop limit exceeded

Answer 1

element-ui 自2.3.5版本后，Table-column取消了默认宽度大小，增加了 type参数，type的可选值有selection/index/expand，每个type对应了一些默认的宽度设置，设置了type不报ResizeObserver loop limit exceeded错误了，但是column的宽度不再自适应均分table的宽度，只能写死width的宽度，这点非常不好，很丑~

Answer 2

https://stackoverflow.com/que...

在升级chrome64版本之后会报这个错误，可以忽略这个错误；这个是提示你无法在单帧动画所有的observers，不会导致程序中断

Answer 3

自定义忽略上报这个错误就好了，暂时无法避免

Answer 4

我也遇到了这个问题，页面刷新会被触发无数次，现在已解决。
我这边用的是vue,出现这个报错的原因是：el-table的菜单里 el-table-column里，设置了min-width属性，检查发现，在vue的mounted钩子里，有手动触发el-table组件里某元素大小样式修改的语句，如
const wrapper = document.getElementsByClassName('el-table__body-wrapper')[0];
wrapper.style.maxHeight = overHg;
从而导致的在页面渲染时，el-table组件的min-width计算元素大小，和这条语句同时作用，元素大小不断计算，造成冲突。
解决办法是在mounted之后再修改maxHeight