Question

为了解决浏览器不喜欢表格主体中除表格元素以外的任何问题的问题，我正在使用tr的自定义元素，如下所示：

  <tr as-element="session-row" repeat.for="session of sessions" session.bind="session"></tr>

但是，这会导致mouseenter.trigger中的任何DOM事件处理程序（{1}}无法找到自定义元素视图模型中的处理程序。

所以，我尝试在自定义元素本身中注入元素并添加侦听器：

tr

在这种情况下，事件发生就好了，他们击中了处理程序。这个问题是，在attached() { this.element.addEventListener('pointerenter', this.doPointerEnter); this.element.addEventListener('pointerleave', this.doPointerLeave); }运行之后的某个时刻，视图模型似乎丢失了元素。即使我将注入的元素放在局部变量中，当我想稍后在其中一个事件处理程序中使用它时，它是attached。

我注意到如果我调试事件处理程序，undefined实际上是this元素，但我的注入元素变量是未定义的。在我捕获注入元素tr的构造函数中是视图模型。

我做错了什么？有没有更好的方法来实现这一目标？

Answer 1

你很可能会被Javascript中的this变幻莫测。

尝试将代码更改为：

attached() {
    this.element.addEventListener('pointerenter', evt => this.doPointerEnter(evt));
    this.element.addEventListener('pointerleave', evt => this.doPointerLeave(evt));
}

那应该为你解决问题。

DOM事件如何与as-element一起使用？

1 个答案: