0

在这个问题之后，我想问一下检查影子 DOM 中组件的初始渲染状态（而不是更新状态）的适当方法。有没有类似的document.readyState或者a的promise？

我也尝试过：

getItems() {
    this.updateComplete
      .then(() => {
        this.nodesLists = this.shadowRoot.querySelectorAll(".name");
      })
      .then(...)
  }

这也失败了。

蒂亚

4

1 回答 1

2

await this.updateComplete（或this.updateComplete.then(...)）是等到元素没有待处理的渲染工作之前的正确方法，例如查询元素的渲染状态，因此只要元素在运行之前连接到文档，您的代码通常应该可以工作getItems。

示例：https ://jsbin.com/jiquhez/edit?html,console,output

但是请注意，如果您updateComplete在连接元素之前await并且该元素没有设置会触发渲染的属性，则updateComplete当前在第一次渲染之前解析。这可能被认为是一个意外错误，在lit-element/#594提交。

请注意，您可能还想研究使用firstUpdated生命周期方法，具体取决于您的用例。这是您可以在您的类上实现的一种方法，以便在元素的第一个更新/渲染周期之后执行一次性工作（例如，对于选择不会根据渲染而改变的静态节点很有用）。

示例：https ://jsbin.com/limikas/edit?html,console,output

于 2019-02-26T22:56:11.097 回答