vue-youtube-embed
vue-youtube-embed copied to clipboard
How pausePlayer() with custom btn?
How I can pausePlayer() with custom btn?
Readme shows how to do it with pauseVideo(), but you hace to instantiate the player in a variable, take a look at https://github.com/kaorun343/vue-youtube-embed#example-code
https://github.com/kaorun343/vue-youtube-embed#example-code
it's not clear for me. my main.js contain:
import VueYouTubeEmbed from 'vue-youtube-embed';
Vue.use(VueYouTubeEmbed);
in component.vue
<youtube :id="item.link" :video-id="item.link" player-width="100%" player-height="325px"></youtube>
i use v-for
, because i have several video items
as i understand, i need to add @playing
event listener on <youtube />
but i cant understand how works pause()
method, can you help with it?
Yeah, add playing event to your component instance and after that, assign the value to a variable:
<youtube :id="item.link" :video-id="item.link" player-width="100%" player-height="325px" @playing="createVideoElement"></youtube>
<button @click="pause()">Pause</button>
Then, In your JS do someting like this:
data() {
return {
videoElem: ""
}
},
methods: {
getVideoElem(event) {
this.videoElem = event
},
pause() {
this.videoElem.pauseVideo()
}
}
First you need a variable to save the video instance, having it you just need to apply the pauseVideo().