将 querySelectorAll 的结果传递给 EventTarget.addEventListener

Question

我想做类似的事情：

open Webapi.Dom;

let addListener = (element) =>
    EventTarget.addEventListener("click", onSubscribeClick, EventTarget.asEventTarget(element));

let addOrRemoveListeners = (handler, ()) => {
    let elements = Document.querySelectorAll({j|[$subscriptionIdAttr]|j}, document);
    Js.Array.forEach(handler, NodeListRe.toArray(elements) |> Js.Array.map(Element.ofNode))
  };

let addListeners = addOrRemoveListeners(addListener);

let removeListeners = addOrRemoveListeners(removeListener);

但是我在 addOrRemoveListeners(addListener); 中得到一个错误：

This is:
  (Dom.eventTarget) => unit
But somewhere wanted:
  (Dom.node) => unit

我应该如何从 Dom.eventTarget 转换为 Dom.node？

编辑：我最终得到了这个：

let addListener = Element.addEventListener("click", onSubscribeClick);
let removeListener = Element.removeEventListener("click", onSubscribeClick);
let addOrRemoveListeners = (handler, ()) => {
  let elements = Document.querySelectorAll({j|[$(subscriptionIdAttr)]|j}, document);
  let () =
    elements
    |> NodeListRe.toArray
    |> Array.map(Element.ofNode)
    |> Array.to_list
    |> List.filter(Js.Option.isSome)
    |> List.map(Js.Option.getExn)
    |> List.iter(handler);
  ()
};
let addListeners = addOrRemoveListeners(addListener);
let removeListeners = addOrRemoveListeners(removeListener);

Answer 1

简答：

external eventTargetToNode : Dom.eventTarget => Dom.node = "%identity";

eventTarget 几乎可以是任何东西，不幸的是，没有好的方法来弄清楚它是什么。在 JavaScript 中，它只是由用户根据上下文推断出来的（可能可以在类型参数中携带该上下文，但将来会在某个地方关闭）。

因此，目前您必须进行不安全的转换才能获得所需内容。

（顺便说一句，您可以使用 Element.addEventListener 来避免从 element 到 eventTarget 的转换）

将 querySelectorAll 的结果传递给 EventTarget.addEventListener

Pass results of querySelectorAll to EventTarget.addEventListener

reason

bucklescript

bs-webapi