如何解决添加videojs-resolution-switcher-v7
请帮助我。
我一直在互联网上寻找解决方案,但是找不到。
当我将插件@ 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 举报,一经查实,本站将立刻删除。