修复播放器重载的bug

examples/App.vue

@@ -1,11 +1,15 @@
 <template>
     <div id="app">
-        <vue-aliplayer-v2 ref="VueAliplayerV2" id="player-1194076936807170050" :options="options" />
+        <template v-if="show">
+            <vue-aliplayer-v2 ref="VueAliplayerV2" id="player-1194076936807170050" :options="options" />
+        </template>
+        <p class="remove-text" v-else>播放器已销毁!</p>
         <div class="player-btns">
             <span @click="play()">播放</span>
             <span @click="pause()">暂停</span>
             <span @click="replay()">重播</span>
             <span @click="getCurrentTime()">播放时刻</span>
+            <span @click="show = !show">{{ show ? '销毁' : '重载' }}</span>
         </div>
     </div>
 </template>
@@ -15,7 +19,8 @@ export default {
         return {
             options: {
                 source:'//player.alicdn.com/video/aliyunmedia.mp4'
-            }
+            },
+            show: true
         }
     },
 
@@ -35,7 +40,7 @@ export default {
 
         getCurrentTime(){
             this.$refs.VueAliplayerV2.getCurrentTime();
-        },
+        }
     }
 }
 </script>
@@ -44,11 +49,16 @@ export default {
     margin: 0;
     padding: 0;
 }
+.remove-text{
+    text-align: center;
+    padding: 20px;
+    font-size: 24px;
+}
 .player-btns{
-    width: 800px;
+    width: 100%;
-    margin: 0 auto;
     display: flex;
     justify-content: space-between;
+    flex-wrap: wrap;
     span {
         margin: 0 auto;
         display: inline-block;

lib/vue-aliplayer-v2.common.js

@@ -127,12 +127,12 @@ if (typeof window !== 'undefined') {
 // EXTERNAL MODULE: ./node_modules/_core-js@2.6.10@core-js/modules/es6.function.name.js
 var es6_function_name = __webpack_require__("7cfd");
 
-// CONCATENATED MODULE: ./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"05d0d90a-vue-loader-template"}!./node_modules/_vue-loader@15.7.2@vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!./node_modules/_vue-loader@15.7.2@vue-loader/lib??vue-loader-options!./packages/AliplayerV2/src/main.vue?vue&type=template&id=66e79580&
+// CONCATENATED MODULE: ./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"05d0d90a-vue-loader-template"}!./node_modules/_vue-loader@15.7.2@vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!./node_modules/_vue-loader@15.7.2@vue-loader/lib??vue-loader-options!./packages/AliplayerV2/src/main.vue?vue&type=template&id=c72078bc&
 var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{attrs:{"id":_vm.id}})}
 var staticRenderFns = []
 
 
-// CONCATENATED MODULE: ./packages/AliplayerV2/src/main.vue?vue&type=template&id=66e79580&
+// CONCATENATED MODULE: ./packages/AliplayerV2/src/main.vue?vue&type=template&id=c72078bc&
 
 // CONCATENATED MODULE: ./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--12-0!./node_modules/_thread-loader@2.1.3@thread-loader/dist/cjs.js!./node_modules/_babel-loader@8.0.6@babel-loader/lib!./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!./node_modules/_vue-loader@15.7.2@vue-loader/lib??vue-loader-options!./packages/AliplayerV2/src/main.vue?vue&type=script&lang=js&
 //
@@ -274,14 +274,14 @@ var staticRenderFns = []
     init: function init() {
       var _this3 = this;
 
-      var load = true;
       var linkID = 'aliplayer-min-css';
       var scriptID = 'aliplayer-min-js';
       var head = document.getElementsByTagName('head');
       var html = document.getElementsByTagName('html');
       var scriptTag = document.getElementById(scriptID);
+      var linkIDTag = document.getElementById(linkID);
 
-      if (!document.getElementById(linkID)) {
+      if (!linkIDTag) {
         var link = document.createElement('link');
         link.type = 'text/css';
         link.rel = 'stylesheet';
@@ -298,14 +298,12 @@ var staticRenderFns = []
         html[0].appendChild(scriptTag);
       }
 
-      scriptTag.addEventListener("load", function () {
+      if (scriptTag && linkIDTag) {
-        _this3.initPlayer();
-
-        load = false;
-      });
-
-      if (!load) {
         this.initPlayer();
+      } else {
+        scriptTag.addEventListener("load", function () {
+          _this3.initPlayer();
+        });
       }
     },
 
@@ -325,10 +323,11 @@ var staticRenderFns = []
           }
         }
 
-        this.config.id = this.id;
+        this.config.id = this.id; // this.player = new Aliplayer(this.config, function(player) {
-        this.player = new Aliplayer(this.config, function (player) {
+        //     // console.log('播放器创建好了',player);
-          console.log('播放器创建好了。', player);
+        // });
-        });
+
+        this.player = new Aliplayer(this.config);
 
         var _loop = function _loop(ev) {
           _this4.player.on(_this4.events[ev], function (e) {

lib/vue-aliplayer-v2.umd.js

@@ -136,12 +136,12 @@ if (typeof window !== 'undefined') {
 // EXTERNAL MODULE: ./node_modules/_core-js@2.6.10@core-js/modules/es6.function.name.js
 var es6_function_name = __webpack_require__("7cfd");
 
-// CONCATENATED MODULE: ./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"05d0d90a-vue-loader-template"}!./node_modules/_vue-loader@15.7.2@vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!./node_modules/_vue-loader@15.7.2@vue-loader/lib??vue-loader-options!./packages/AliplayerV2/src/main.vue?vue&type=template&id=66e79580&
+// CONCATENATED MODULE: ./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"05d0d90a-vue-loader-template"}!./node_modules/_vue-loader@15.7.2@vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!./node_modules/_vue-loader@15.7.2@vue-loader/lib??vue-loader-options!./packages/AliplayerV2/src/main.vue?vue&type=template&id=c72078bc&
 var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{attrs:{"id":_vm.id}})}
 var staticRenderFns = []
 
 
-// CONCATENATED MODULE: ./packages/AliplayerV2/src/main.vue?vue&type=template&id=66e79580&
+// CONCATENATED MODULE: ./packages/AliplayerV2/src/main.vue?vue&type=template&id=c72078bc&
 
 // CONCATENATED MODULE: ./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--12-0!./node_modules/_thread-loader@2.1.3@thread-loader/dist/cjs.js!./node_modules/_babel-loader@8.0.6@babel-loader/lib!./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--0-0!./node_modules/_vue-loader@15.7.2@vue-loader/lib??vue-loader-options!./packages/AliplayerV2/src/main.vue?vue&type=script&lang=js&
 //
@@ -283,14 +283,14 @@ var staticRenderFns = []
     init: function init() {
       var _this3 = this;
 
-      var load = true;
       var linkID = 'aliplayer-min-css';
       var scriptID = 'aliplayer-min-js';
       var head = document.getElementsByTagName('head');
       var html = document.getElementsByTagName('html');
       var scriptTag = document.getElementById(scriptID);
+      var linkIDTag = document.getElementById(linkID);
 
-      if (!document.getElementById(linkID)) {
+      if (!linkIDTag) {
         var link = document.createElement('link');
         link.type = 'text/css';
         link.rel = 'stylesheet';
@@ -307,14 +307,12 @@ var staticRenderFns = []
         html[0].appendChild(scriptTag);
       }
 
-      scriptTag.addEventListener("load", function () {
+      if (scriptTag && linkIDTag) {
-        _this3.initPlayer();
-
-        load = false;
-      });
-
-      if (!load) {
         this.initPlayer();
+      } else {
+        scriptTag.addEventListener("load", function () {
+          _this3.initPlayer();
+        });
       }
     },
 
@@ -334,10 +332,11 @@ var staticRenderFns = []
           }
         }
 
-        this.config.id = this.id;
+        this.config.id = this.id; // this.player = new Aliplayer(this.config, function(player) {
-        this.player = new Aliplayer(this.config, function (player) {
+        //     // console.log('播放器创建好了',player);
-          console.log('播放器创建好了。', player);
+        // });
-        });
+
+        this.player = new Aliplayer(this.config);
 
         var _loop = function _loop(ev) {
           _this4.player.on(_this4.events[ev], function (e) {

package.json

@@ -1,6 +1,6 @@
 {
     "name": "vue-aliplayer-v2",
-    "version": "1.0.9",
+    "version": "1.1.0",
     "author": "yxs",
     "description": "感谢每一位开源的开发者. 这是一个基于Alipayer 开发并封装成vue组件的播放器.",
     "main":"lib/vue-aliplayer-v2.umd.min.js",

packages/AliplayerV2/src/main.vue

@@ -129,13 +129,13 @@ export default {
          * 加载Alipayer的SDK
          */
         init(){
-            let load = true;
             const linkID = 'aliplayer-min-css';
             const scriptID = 'aliplayer-min-js';
             const head = document.getElementsByTagName('head');
             const html = document.getElementsByTagName('html');
             let scriptTag = document.getElementById(scriptID);
-            if(!document.getElementById(linkID)) {
+            let linkIDTag = document.getElementById(linkID);
+            if(!linkIDTag) {
                 const link = document.createElement('link');
                 link.type = 'text/css';
                 link.rel = 'stylesheet';
@@ -151,13 +151,12 @@ export default {
                 html[0].appendChild(scriptTag);
             }
 
-            scriptTag.addEventListener("load", () => {
+            if(scriptTag && linkIDTag){
-                this.initPlayer();
-                load = false;
-            });
-
-            if(!load){
                 this.initPlayer();
+            } else {
+                scriptTag.addEventListener("load", () => {
+                    this.initPlayer();
+                });
             }
         },
 
@@ -174,9 +173,10 @@ export default {
                     }
                 }
                 this.config.id = this.id;
-                this.player = new Aliplayer(this.config, function(player) {
+                // this.player = new Aliplayer(this.config, function(player) {
-                    console.log('播放器创建好了。',player);
+                //     // console.log('播放器创建好了',player);
-                });
+                // });
+                this.player = new Aliplayer(this.config);
                 for(const ev in this.events){
                     this.player.on(this.events[ev],(e)=>{
                         // console.log(`object ${this.events[ev]}`,e);