javascript - 样式加载事件后的 LitElement 阴影根

Question

我有一个问题，我需要在 CSS 样式加载到我的组件中后处理事件。我试图使用 lit-element 生命周期，但它们仍然被提前解雇。

我正在尝试获取 DOM 元素的起始位置和其他数据，但我得到了一个初始位置，在加载样式后该位置会发生变化吗？

如何使样式首先加载或在样式加载后加载任何事件？

Answer 1

firstUpdated生命周期通常是您正在寻找的:

Called after the element’s DOM has been updated the first time, immediately before updated is called. Implement firstUpdated to perform one-time work after the element’s template has been created.

如果即使在 firstUpdated 被触发后您的元素仍在加载，您可以等待另一个周期以确保安全:

setTimeout(() => { /* code for checking DOM styles */ }, timeInMilliseconds);

timeInMilliseconds 可能只需要为 0，但您可能需要多给它一点时间，因为您的样式正在发生超出典型样式的变化。如果您有任何可能影响元素显示的 CSS animation 或 transition，也可能出现这种情况。

如果以上所有内容看起来正确，我建议在 lit-element github page 上打开一个问题因为它仍在积极贡献。