Question

使用javascript，我检查用户是否在带有event.target的2个div中单击，它可以正常工作，但是在代码中会显示以下错误消息：

'EventTarget |类型的参数“空”不能分配给“节点|类型”参数空值'。类型“ EventTarget”缺少类型“节点”中的以下属性：baseURI，childNodes，firstChild，isConnected和另外44个。Vetur（2345）

cogsClose() {
    if (
      !document.querySelector(".cogs-window")!.contains(event.target)! &&
      !document.querySelector(".fa-cogs")!.contains(event.target)
    ) {
      document.getElementById("cogs-user")!.classList.add("cogs-hide");
      document.getElementById("cogs-tabs")!.classList.add("cogs-hide");
    }
  }

错误同时显示在两个event.target上。

Answer 1

让我们检查一下lib.dom.d.ts的内容。因此，包含函数签名如下所示：

contains(other: Node | null): boolean;

并键入mouseEvent的属性目标为

readonly target: EventTarget | null;

EventTarget与Node不兼容。这是因为目标不必总是doc中提到的Node类型。但是，如果您确定要键入，那么您可以将该权利强制转换为Node或HTMLElement或类似的东西。

.contains(<Node>(event!.target))

但是请注意。.类型在这里可以保护我们，因此出于某种原因，签名看起来像这样。使用相同！到处都是。

当使用event.target时，它可以在网站上运行，但在代码上有错误

1 个答案: