问题描述
请帮助我。
我一直在互联网上寻找解决方案,但是找不到。
当我将插件@ xiaoyexiang / videojs-resolution-switcher-v7插入时,它没有播放。
我正在使用vuejs2,video.js7。 我正在使用@ xiaoyexiang / videojs-resolution-switcher-v7插件。
Vue component
<template>
<video-player class="ideo-player-Box"
id='video'
ref="videoPlayer"
:options="playerOptions"
:playsinline="true"
@play="onPlayerPlay($event)"
@pause="onPlayerPause($event)"
@statechanged="playerStateChanged($event)"
@ready="playerReadied">
</video-player>
</template>
<script>
// Similarly,you can also introduce the plugin resource pack you want to use within the component
import videojs from 'video.js'
window.videojs = videojs
require('@xiaoyexiang/videojs-resolution-switcher-v7')
export default {
data() {
return {
playerOptions: {
// videojs options
/* preload:"auto",*/
height: '250',controlBar: {
remainingTimedisplay: true,},label: 'SD',muted: true,language: 'en',playbackRates: [0.7,1.0,1.5,2.0],sources: [{
src: 'https://vjs.zencdn.net/v/oceans.mp4?SD',type: 'video/mp4',res: 480
},{
src: 'https://vjs.zencdn.net/v/oceans.mp4?HD',label: 'HD',res: 720
}
],autoplay: false,controls: true,plugins: {
videoJsResolutionSwitcher: {
default: 'low',// Default resolution [{Number},'low','high'],dynamicLabel: true
}
},poster: "https://graphicriver.img.customer.envatousercontent.com/files/278099749/preview_13070075.jpg?auto=compress%2Cformat&q=80&fit=crop&crop=top&max-h=8000&max-w=590&s=d79f2ef088cc37d58faa7f986a62f148",}
},mounted() {
},computed: {
player() {
return this.$refs.videoPlayer.player
}
},beforeDestroy() {
if (this.player) {
this.player.dispose()
}
},methods: {
onPlayerPlay (player) {
console.log('player play!',player)
},onPlayerReady (player) {
console.log('player ready!',player)
},playerReadied(player){
},playerStateChanged(player){
}
}
}
</script>
<style scoped>
</style>
app.js
import Vue from 'vue';
import VueVideoPlayer from 'vue-video-player' // also tried vue-video-player-videojs-7
Vue.use(VueVideoPlayer)
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)