[Vuejs]-How to add videojs event listener?

by

2👍

Alright, this is just

this.player.on('play', () => {
    this.play()
})
this.player.on('pause', () => {
    this.stop()
})
👤Yaroslav Saenko

1👍

VideoJS uses the HTML5 <video> element, so you can just use the events associated with that element.

Example:

document.querySelector(".video").addEventListener("play", (e) => {
  console.log("playing...");
});

document.querySelector(".video").addEventListener("pause", (e) => {
  console.log("paused...");
});
<link href="https://vjs.zencdn.net/7.20.1/video-js.css" rel="stylesheet" />
<script src="https://vjs.zencdn.net/7.20.1/video.min.js"></script>

<video class="video-js video" controls preload="auto" width="640" height="268" data-setup='{ "playbackRates": [0.5, 1, 1.5, 2],"loopbutton": true  }'>
  <source src="http://vjs.zencdn.net/v/oceans.mp4" type='video/mp4'>
  <source src="http://vjs.zencdn.net/v/oceans.webm" type='video/webm'>
</video>
👤JoshG

Leave a comment