fix: 绘画详情页 resizeObserver的内存泄漏的问题

src/components/PaintingDetailBox.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted, computed } from 'vue'
+import { ref, onMounted, computed, onBeforeUnmount } from 'vue'
 
 import { useRoute } from 'vue-router'
 
@@ -66,11 +66,13 @@ const mousemoveFu = (e, flag) => {
   }
 }
 
+let resizeObserver = null
+
 onMounted(() => {
   const element = document.querySelector('#myElement')
 
 
-  const resizeObserver = new ResizeObserver(entries => {
+  resizeObserver = new ResizeObserver(entries => {
     for (let entry of entries) {
       console.log(`Width changed to ${entry.contentRect.width}`)
       // 在这里执行你的逻辑
@@ -100,6 +102,7 @@ onMounted(() => {
         }
       }, 700)
       tiemrr.value = setInterval(() => {
+        console.log('interval')
         if (zhouMove.value >= 99) clearInterval(tiemrr.value)
         zhouMove.value = zhouMove.value + 1
       }, 30)
@@ -107,7 +110,9 @@ onMounted(() => {
   })
 
   resizeObserver.observe(element)
-
+})
+onBeforeUnmount(() => {
+  resizeObserver.disconnect()
 })
 </script>
 

src/views/ShuangGou.vue

@@ -144,14 +144,14 @@ const isShowVideos = ref(false)
 function onClickHotspot(idx) {
   if (idx === 1) {
     router.push({
-      name: 'PaintingDetail',
+      name: 'PaintingDetailSimple',
       query: {
         idx: 20,
       }
     })
   } else if (idx === 2) {
     router.push({
-      name: 'PaintingDetail',
+      name: 'PaintingDetailSimple',
       query: {
         idx: 21,
       }