带数据的调度事件 [英] Dispatch event with data

问题描述

我想发送一个事件，将一些数据传递给监听该事件的任何事件监听器。

I'd like to dispatch an event that will pass some data to any event listeners that listen on that event.

考虑一个触发事件的函数：

Considering a function that fires an event:

function click() {
  const x = 'foo'
  document.dispatchEvent(new CustomEvent('clicked'))
}

click()

如何我可以将自定义数据传递给事件监听器吗？

How can I pass custom data to the event listener?

document.addEventListener('clicked', function(e) {
  console.log(x) // logs "foo"
})

推荐答案

也许您正在寻找 event.detail

new CustomEvent('eventName', {'detail': data})

而不是数据使用x并在事件监听器中，您可以使用event.detail访问x

Instead of data use x and in event listener you can access x using event.detail

function getSelectionBounds() {
  var x = (bounds["x"].toFixed(2));
  var y = "xyz";
  var selectionFired = new CustomEvent("selectionFired", {
    "detail": {"x":x,"y":y }
  });

  document.dispatchEvent(selectionFired);
};

document.addEventListener("selectionFired", function (e) {
  alert(e.detail.x+"   "+e.detail.y);
});

这篇关于带数据的调度事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！