LitElement生命周期:首次渲染之前

时间:2019-12-09 10:51:00

标签: polymer lit-element

是否有一种方法可以在组件具有可用属性之后但在第一次渲染之前准确地执行方法? 我的意思是在类contructor()firstUpdated()之间。 听起来微不足道,也许实际上我缺少了一些微不足道的东西。

1 个答案:

答案 0 :(得分:2)

在创建元素时调用元素的构造函数,无论是通过HTML解析器,还是例如通过document.createElement

下一个回调是connectedCallback,当DOM节点连接到文档时调用。此时,您可以访问元素的轻型DOM。请确保在执行自己的工作之前先调用super.connectedCallback(),因为LitElement实例在这里有一些工作要做。

下一个回调是shouldUpdate,这是一个可选的谓词,用于通知LitElement是否应运行其渲染周期。例如,如果您有一个观察到的data属性并在render中解构了它的深层属性,则很有用。我发现最好将此作为谓词,而不要在其中添加各种生命周期逻辑。

此后,先调用updaterender,然后再调用updatedfirstUpdated。在render中执行副作用通常被认为是不好的做法,您真正需要覆盖update的情况很少见。

在您的情况下,听起来非常像您应该在connectedCallback中进行工作,除非您依赖LitElement的渲染阴影DOM,在这种情况下,您可以考虑在firstUpdated中运行代码,然后调用this.requestUpdate()强制进行第二次更新(或更改firstUpdated中的某些观察到的属性)

更多信息:https://lit-element.polymer-project.org/guide/lifecycle