Javascript Vuejs侦听器

我正在创建一个简单的应用程序，它的侦听器很少。我不明白这背后的逻辑应该是什么样子

HTML:

我的听众应该是这样的：

music.addEventListener("timeupdate", timeUpdate, false);

music.addEventListener("canplaythrough", function () {
    //code
}, false);

function timeUpdate() {
    //code
}

<video @timeupdate="onTimeUpdateListener" src="..."></video>

---

那么，在vuejs中使用侦听器的正确方法是什么呢？我应该在这里使用自定义指令吗？因为我没有事件，所以不能使用方法。将整个逻辑放入

ready

函数似乎不是正确的方法。提前谢谢

这将是Vue风格的将HTML元素分配给应用程序的方式：

<video v-el:video-element controls>
    <source src="mov_bbb.mp4" type="video/mp4">
</video>

显然，您可以将所有视频（或任何其他与事件相关的）内容放在单独的（不是Vue中的指令）中，以使代码更整洁。

v-on（简写：@） 在普通元素上使用时，它只侦听本机DOM事件。在自定义元素组件上使用时，它还侦听在该子组件上发出的自定义事件

因此，您可以像这样附加一个事件侦听器：

music.addEventListener("timeupdate", timeUpdate, false);

music.addEventListener("canplaythrough", function () {
    //code
}, false);

function timeUpdate() {
    //code
}

<video @timeupdate="onTimeUpdateListener" src="..."></video>

下面是我使用库的一个示例：

<video @timeupdate="onTimeUpdateListener" src="..."></video>