将点击处理程序添加到引用？

Question

我正在使用 3rd 方包，但需要添加一小段交互。

该包有一个按钮，参考为“next”。无论如何要向此引用添加点击处理程序？

Answer 1

这可能有帮助：

public mounted() {
    const next = this.$refs.next as HTMLElement;
    next.addEventListener('click', this.onNextClick, false);
}

public onNextClick() {
    // do your stuff here
}

Answer 2

我遇到了这个问题，正在寻求类似问题的解决方案。然而我的情况是ref在 Vue 组件对象上设置了一个属性。在引用的对象上使用 simple 时addEventListener出现错误：

addEventListener 不是函数

$el解决方案是在引用组件的属性（即实际的 HTML 元素）上调用该函数。

this.$refs.next.$el.addEventListener('click', function() {
  /* do stuff here*/
}, false);

从之前答案的评论中我发现OP也可能是这种情况。

Answer 3

像这样的东西：

this.$refs.next.addEventListener('click', function() {
  /* do stuff here*/
}, false);