Table组件在无数据时，组件添加 scroll="{ x: 2000 }" 后报错。ResizeObserver loop limit exceeded

[serveboy]

• I have searched the issues of this repository and believe that this is not a duplicate.

Version

3.2.20

Environment

"vue": "^3.2.13",

Reproduction link

https://antdv.com/components/table-cn

Steps to reproduce

table 组件 data-source数据源数组为空时，table 组件使用 :scroll="{ x: 2000 }控制x 滚动。 会报错： ResizeObserver loop limit exceeded
at eval (webpack-internal:///./node_modules/webpack-dev-server/client/overlay.js:296:58)

What is expected?

给出解决办法

What is actually happening?

ResizeObserver loop limit exceeded
at eval (webpack-internal:///./node_modules/webpack-dev-server/client/overlay.js:296:58)

[Dylan-lijl]

I also encountered this issue, but I used the table component in some parts in the same way as using scroll. Removing the scroll from the faulty component or adding a default value to the data array can eliminate it

[Dylan-lijl]

I found that when there is no data, this issue occurs when the scroll has set x, but upgrading to version 4 does not solve this problem

[swj857578]

I also encountered the same problem

[Dylan-lijl]

I have found a solution. Since the problem cannot be solved, I will eliminate the person who raised the problem, so I added the following code to the App. vue file:
`const ignoreErrors = ["ResizeObserver loop completed with undelivered notifications", "ResizeObserver loop limit exceeded"]

window.addEventListener('error', e => {
let errorMsg = e.message;
ignoreErrors.forEach(m => {
if (errorMsg.startsWith(m)) {
console.error(errorMsg);
if (e.error) {
console.error(e.error.stack);
}
const resizeObserverErrDiv = document.getElementById(
'webpack-dev-server-client-overlay-div'
);
const resizeObserverErr = document.getElementById(
'webpack-dev-server-client-overlay'
);
if (resizeObserverErr) {
resizeObserverErr.setAttribute('style', 'display: none');
}
if (resizeObserverErrDiv) {
resizeObserverErrDiv.setAttribute('style', 'display: none');
}
}
})
});`

[swj857578]

I have found a solution. Since the problem cannot be solved, I will eliminate the person who raised the problem, so I added the following code to the App. vue file: `const ignoreErrors = ["ResizeObserver loop completed with undelivered notifications", "ResizeObserver loop limit exceeded"]

window.addEventListener('error', e => { let errorMsg = e.message; ignoreErrors.forEach(m => { if (errorMsg.startsWith(m)) { console.error(errorMsg); if (e.error) { console.error(e.error.stack); } const resizeObserverErrDiv = document.getElementById( 'webpack-dev-server-client-overlay-div' ); const resizeObserverErr = document.getElementById( 'webpack-dev-server-client-overlay' ); if (resizeObserverErr) { resizeObserverErr.setAttribute('style', 'display: none'); } if (resizeObserverErrDiv) { resizeObserverErrDiv.setAttribute('style', 'display: none'); } } }) });`

Connecting to some alarm platforms cannot solve the problem and will still be reported

[zeroojs]

I have also encountered this issue

[github-actions]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days

[yuanbolin]

这问题还没解决??

[angelbi]

设置一个minWith:>500px的值，有效解决

[webstudying123]

默认设置dataSource的值不为空数组 [{}] 即可解决
<a-able dataSource={ [{}] } scroll={{ x: 2000 }} />

[chenliangngng]

设置一个minWith:>500px的值，有效解决

I successfully resolved this issue.

:global {
      .ant-empty-description {
        min-width: 600px;
      }
    }