demo: update

Author: freeshineit

demos/with-vue2.6/package.json

@@ -9,9 +9,10 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "ezuikit-js": "^8.1.10",
     "core-js": "^3.18.1",
-    "vue": "2.6.14"
+    "ezuikit-js": "8.1.10-beta.6",
+    "vue": "2.6.14",
+    "vue-router": "3"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "4.5.13",

demos/with-vue2.6/pnpm-lock.yaml

@@ -1,19 +1,15 @@
 <template>
-    <div id="app">
-        <Player />
-    </div>
+  <div id="app">
+    <router-view></router-view>
+  </div>
 </template>
-<script>
-import Player from "./components/Multi.vue";
-
-export default {
-  name: "App",
-  components: {
-    Player,
-  },
-};
-</script>
 <style>
+html,
+body {
+  padding: 0;
+  margin: 0;
+}
+
 #app {
   font-family: Avenir, Helvetica, Arial, sans-serif;
   -webkit-font-smoothing: antialiased;

demos/with-vue2.6/src/App.vue

@@ -95,18 +95,12 @@ export default {
 
       // 首帧渲染成功
       // first frame display
-      player.eventEmitter.on(
-        EZUIKitPlayer.EVENTS.firstFrameDisplay,
-        () => {
-          console.log("firstFrameDisplay ");
-        }
-      );
-      player.eventEmitter.on(
-        EZUIKitPlayer.EVENTS.streamInfoCB,
-        (info) => {
-          console.log("streamInfoCB ", info);
-        }
-      );
+      player.eventEmitter.on(EZUIKitPlayer.EVENTS.firstFrameDisplay, () => {
+        console.log("firstFrameDisplay ");
+      });
+      player.eventEmitter.on(EZUIKitPlayer.EVENTS.streamInfoCB, (info) => {
+        console.log("streamInfoCB ", info);
+      });
 
       window.player = player;
     },

demos/with-vue2.6/src/components/Multi.vue

@@ -1,8 +1,10 @@
 import Vue from "vue";
+import router from "./router";
 import App from "./App.vue";
 
-Vue.config.productionTip = false
+Vue.config.productionTip = false;
 
 new Vue({
+  router,
   render: (h) => h(App),
 }).$mount("#app");

demos/with-vue2.6/src/components/Player.vue

@@ -0,0 +1,23 @@
+<template>
+  <div class="page">
+    <div style="padding-bottom: 30px">
+      <Player />
+    </div>
+    <router-link to="/multi">多屏实例(Multi screen)</router-link>
+  </div>
+</template>
+
+<script>
+import Player from "../components/Player.vue";
+
+export default {
+  name: "Home",
+  components: {
+    Player,
+  },
+  mounted: () => {
+    console.group("mounted 组件挂载完毕状态===============》");
+  },
+  methods: {},
+};
+</script>