Merge branch 'master' of https://gitlab-pro.ezijing.com/ezijing-web/center-resource

src/components/base/AppVideoPlayer.vue

 <template>
-  <div>
-    <video ref="videoPlayer" class="video-js vjs-default-skin vjs-big-play-centered vjs-16-9"></video>
+  <div ref="videoWrapper">
+    <!-- <video ref="videoPlayer" class="video-js vjs-default-skin vjs-big-play-centered vjs-16-9" id="videoJS"></video> -->
   </div>
 </template>
 
@@ -40,11 +40,13 @@ export default {
       deep: true,
       handler() {
         if (this.player) {
-          // this.player.src(options.sources)
-
-          this.player.reset()
+          this.player.dispose()
+          this.player = null
         }
-        this.initPlayer()
+        this.createVideo()
+        this.$nextTick(() => {
+          this.initPlayer()
+        })
       }
     }
   },
@@ -55,9 +57,13 @@ export default {
     this.player && this.player.dispose()
   },
   methods: {
+    createVideo() {
+      const html = `<video class="video-js vjs-default-skin vjs-big-play-centered vjs-16-9" id="videoJS"></video>`
+      this.$refs.videoWrapper.innerHTML = html
+    },
     initPlayer() {
       const self = this
-      this.player = videojs(this.$refs.videoPlayer, this.videoOptions, function onPlayerReady() {
+      this.player = videojs(document.querySelector('#videoJS'), this.videoOptions, function onPlayerReady() {
         self.$emit('ready', this)
         const DEFAULT_EVENTS = [
           'abort',