相关疑难解决方法(0)

在connectedCallback中等待Element Upgrade:FireFox和Chromium差异

2023 年 3 月更新

注意:这是有效的,因为在下一个刻度中,lightDOM 中的N 个(不是全部!)DOM 元素将被解析。

对于 (app.) N > 1000你会遇到麻烦,因为延迟将在解析所有 N 个元素之前结束。

因此,要么添加(大约 20 行)代码来实际检查所有 lightDOM 是否已解析。(但是由于您的 DOM 正在遭受 Obesitas 的困扰,因此您可能还会遇到其他性能问题)

或者只是保持 lightDOM中N 个 DOM 元素的数量较小。

当然,您稍后在解析之后添加的任何 DOM都不会影响任何内容(当不触发时)connectedCallback

2021 年 3 月更新:

FireFox 错误已修复,现在的行为与 Chromium 和 Safari 相同。

这意味着等待 JS EventLoop 为空(带有setTimeoutrequestAnimationFrame)现在connectedCallback是一个跨浏览器方法

connectedCallback(){
 setTimeout(()=>{
   // can access lightDOM here
 }); // ,0 not required
}
Run Code Online (Sandbox Code Playgroud)

事件循环到底是什么?- 菲利普·罗伯茨 …

callback class-method web-component custom-element

10
推荐指数
1
解决办法
1245
查看次数