在vue上使用videojs播放m3u8文件，然后在页面切换到下一个页面的时候，出现播放器重复定义的问题：

提示：Player “my-video” is already initialised. Options will not be applied.

需要在路由销毁前把播放器销毁即可，然后mounted的时候进行初始化。

具体代码

<video      ref="myVideoPlayer"
          id="my-video"
          class="video-js vjs-default-skin vjs-big-play-centered"
          controls
         style="width: 100%;height:100%"
      >
        <source type="application/x-mpegURL" />
      </video>


js部分
mounted（）{
 this.myPlayer = videojs(
          "my-video",
          {
            bigPlayButton: true,
            textTrackDisplay: false,
            posterImage: true,
            errorDisplay: false,
            controlBar: true,
            controls:true,
            hls: {
              withCredentials: true
            }
          },
          function () {
            this.on('play', function () {
              console.log('playing')
                that.doPlay()
            })
            //this.play();
            console.log('myPlayer ready')
          }
      );}
 beforeDestroy() {
    this.myPlayer.dispose();  //销毁播放器
  }