zoukankan      html  css  js  c++  java
  • 使用video.js踩坑。单页切换后无法播放

    问题:动态创建多个video实例后,切换其他页面后在切换回来,无法播放,控制台报警告id被占用!

    思路:在生命周期beforeDestroy函数中销毁创建的video实例。

    代码:

     beforeDestroy(){ //(第三步)在销毁之前拿到video实例
        for(let i=0;i<this.playlist.length;i++){
         this.playlist[i].dispose(); //(第四步)dispose()是官方的销毁函数
        }
      },
      mounted() {
        setTimeout(_ => {  
          let lang=this.videolist.pageData.length   //(第一步)这是多个视频地址数组的长度
          for(let i=0;i<lang;i++){
          var player=  videojs("my-video"+i, {   //播放的事件
                  textTrackDisplay: false,
                  posterImage: true,
                  errorDisplay: false,
                  controlBar: true,
                  hls: {
                    withCredentials: true
                  }
                }, function () {
                  // this.play()   //取消自动播放
                })
                  this.playlist.push(player)  //(第二步)palylist是定义的空数组,存放多个视频实例
          }
        }, 1000);
      },

    接上上篇博客《在vue项目中播放m3u8格式的视频》

    博客地址:https://www.cnblogs.com/cb1490838281/p/12331262.html

  • 相关阅读:
    0603学术诚信和职业道德
    0602第二个冲刺
    0525《构建之法》8、9、10章读后感
    0525Sprint回顾
    实验三进程调度
    解决提问的问题
    阅读《构建之法》第13-17章
    阅读:第10、11、12章
    作业5.2(封装及测试)
    作业5.1
  • 原文地址:https://www.cnblogs.com/cb1490838281/p/12424892.html
Copyright © 2011-2022 走看看