polymer - 聚合物、影子 dom、事件和冒泡

Question

我有一个使用 shadow dom (v1) 的聚合物自定义元素，该元素位于另一个聚合物自定义元素内，也包裹在 shadow dom 中。

据我了解，当最内部的元素引发事件时，最外部的元素（应用程序）应该能够监听这些事件。这是不正确的吗？

我在应用程序组件内的评论组件内有一个评级组件。评级组件抛出一个事件：

this.dispatchEvent(new CustomEvent('custom-event'), { bubbles:true, composed:true });

但是，应用程序组件中的以下代码永远不会被触发。

connectedCallback() { 
  super.connectedCallback();
  this.addEventListener('custom-event', () => { console.log('a');});
}

除非有人停止传播，否则我假设事件最终应该从不同的阴影区域一直冒泡到窗口，我是否不正确？

感谢任何答案..

约翰。

score 2 · Accepted Answer

找到它，我将选项设置为dispatchEvent的参数，而不是将选项添加到CustomEvent。

所以而不是

this.dispatchEvent(new CustomEvent("event"), { options });

你所要做的

this.dispatchEvent(new CustomEvent("event", { options }));

1 回答 1