feats

src/pages/game/game.js

@@ -81,7 +81,7 @@ export default function game({ el, center, onError, onSuccess, onBingo }) {
   const mntMap = {}
 
   // 初始化
-  const two = new Two({
+  let two = new Two({
     fullscreen: true,
     autostart: true
   }).appendTo(el);
@@ -362,11 +362,11 @@ export default function game({ el, center, onError, onSuccess, onBingo }) {
     stop: () => {
       isFinished = true;
     },
-    destroy: () => {
-    
+    destroy: () => {    
       two.unbind('update');
       two.pause();
       el.removeChild(two.renderer.domElement);
+      two = null;
     }
   }
 }

src/pages/game/index.vue

@@ -5,7 +5,7 @@
 
 <script setup>
   import { onBeforeUnmount, onMounted, ref } from 'vue';
-import { useRouter } from 'vue-router';
+import { useRouter, onBeforeRouteUpdate, onBeforeRouteLeave } from 'vue-router';
   import FireWorkListVue from '@/components/FireWorkList.vue';
   import game from "./game.js";
 
@@ -44,13 +44,23 @@ import { useRouter } from 'vue-router';
     })
   }
 
+  onBeforeRouteUpdate(() => {
+    console.log('--------ref----<', el)
+  })
+
+  onBeforeRouteLeave(() => {
+    console.log('--------onBeforeRouteLeave----<')
+  })
+
   onMounted(() => {
     gameInit()
+    console.log('--------onMounted----<', el)
   })
 
   onBeforeUnmount(() => {
+    console.log('--------onBeforeUnmount----<', el)
     if (destroyRef.value) {
-      destroyRef.value();
+      destroyRef.value.destroy();
     }
   })