提交 f2ced3ef authored 作者: lihuihui's avatar lihuihui
<template> <template>
<div> <div ref="videoWrapper">
<video ref="videoPlayer" class="video-js vjs-default-skin vjs-big-play-centered vjs-16-9"></video> <!-- <video ref="videoPlayer" class="video-js vjs-default-skin vjs-big-play-centered vjs-16-9" id="videoJS"></video> -->
</div> </div>
</template> </template>
...@@ -40,11 +40,13 @@ export default { ...@@ -40,11 +40,13 @@ export default {
deep: true, deep: true,
handler() { handler() {
if (this.player) { if (this.player) {
// this.player.src(options.sources) this.player.dispose()
this.player = null
this.player.reset()
} }
this.createVideo()
this.$nextTick(() => {
this.initPlayer() this.initPlayer()
})
} }
} }
}, },
...@@ -55,9 +57,13 @@ export default { ...@@ -55,9 +57,13 @@ export default {
this.player && this.player.dispose() this.player && this.player.dispose()
}, },
methods: { methods: {
createVideo() {
const html = `<video class="video-js vjs-default-skin vjs-big-play-centered vjs-16-9" id="videoJS"></video>`
this.$refs.videoWrapper.innerHTML = html
},
initPlayer() { initPlayer() {
const self = this const self = this
this.player = videojs(this.$refs.videoPlayer, this.videoOptions, function onPlayerReady() { this.player = videojs(document.querySelector('#videoJS'), this.videoOptions, function onPlayerReady() {
self.$emit('ready', this) self.$emit('ready', this)
const DEFAULT_EVENTS = [ const DEFAULT_EVENTS = [
'abort', 'abort',
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论