我的监控呈现实现代码
import HlsJsPlayer from 'xgplayer-hls.js';
computed: {
...mapState({
list: (state) => state.videoList.listone,
}),
newlist() {
return JSON.parse(JSON.stringify(this.list));
},
},
mounted() {
this.videoBox();
},
methods: {
videoBox() {
// console.log('videoSrc:', videosrc);
if (this.player) {
this.player.destroy(true);
this.player = null;
// this.player.src = this.list.rtmpUrl
// console.log(this.player.currentSrc)
}
if (this.list.status == 1) {
this.player = new HlsJsPlayer({
id: 'videoElement',
url: this.list.rtmpUrl,
lang: 'zh-cn',
autoplay: true, //自动播放
playsinline: true,
fluid: true,
ignores: ['volume'],//控制条忽略相关配置项 ['time', 'definition', 'error', 'fullscreen', 'i18n', 'loading', 'mobile', 'pc', 'play', 'poster', 'progress', 'replay', 'volume']
fitVideoSize: 'fixWidth',
});
}
},
},
beforeDestroy() {
if (this.player) {
this.player.destroy(true);
this.player = null;
}
},