Javascript 侦听stencilJS中的全局窗口事件

假设我在应用程序的某个地方有这样的东西：

var event = new Event('build');
window.dispatchEvent(event);

在stencilJS文档中，他们说您可以收听如下全局事件：

@Listen('body:scroll')
handleScroll(ev) {
    console.log('the body was scrolled', ev);
}

但我找不到监听窗口上发出的事件的方法，就像我可以用普通Javascript监听一样：

window.addEventListener('build', function (e) { 
  console.log('Event happened',e);
}, false);

---

有什么想法吗

好的，我在这里做了一个示例，听一个组件发布的事件

但这是一般的解决办法。我将使用模具事件发射器并从组件发射。假设您执行此操作并从名为fancyEvent的组件发出事件

@Event() fancyEvent: EventEmitter;
...
this.fancyEvent.emit($event);

要在窗口上（即在index.js中）收听此事件，可以执行以下两种操作之一。如果你有一个transpiler，比如typescript，你可以这样听

@Listen('fancyEvent')
function doSomethingFancy() {}

但在香草es5风格的javascript中，您也可以像这样收听这些自定义事件

window.addEventListener('fancyEvent', function(e) {})

---

好的，我在这篇文章中做了一个监听组件发布事件的例子

但这是一般的解决办法。我将使用模具事件发射器并从组件发射。假设您执行此操作并从名为fancyEvent的组件发出事件

@Event() fancyEvent: EventEmitter;
...
this.fancyEvent.emit($event);

要在窗口上（即在index.js中）收听此事件，可以执行以下两种操作之一。如果你有一个transpiler，比如typescript，你可以这样听

@Listen('fancyEvent')
function doSomethingFancy() {}

但在香草es5风格的javascript中，您也可以像这样收听这些自定义事件

window.addEventListener('fancyEvent', function(e) {})

---

我尝试了stencil docs示例，但它不起作用。然后我将“body”更改为“window”，现在我在控制台中看到了滚动事件

@Listen('window:scroll')
handleScroll(ev) {
  console.log('the body was scrolled', ev);
}

---

我尝试了stencil docs示例，但它不起作用。然后我将“body”更改为“window”，现在我在控制台中看到了滚动事件

@Listen('window:scroll')
handleScroll(ev) {
  console.log('the body was scrolled', ev);
}

正式文件：

正式文件：