当使用Element Plus 时,遇到ResizeObserve出现错误,主要是Tab组件和Table组件,在网上查了一下,发现是在Resize时,如果更新组件就有可能导致该问题,感觉是这些组件本身的设计问题,在网上查了一下,目前只能使用补丁去掉这个问题,但应该不是根治的办法。在App.vue中增加如下代码。
<script>
const debounce = (fn, delay) => {
let timer = null; return function () {
// eslint-disable-next-line @typescript-eslint/no-this-alias
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); }
}
</script>
后续:最后这个问题的解决了。使用vue官网推荐的创建项目模板,然后安装element plus,问题消失。vue create已经进入维护期,不推荐使用。
网友评论