修复内存泄漏问题，优化Blob URL清理机制

src/components/ImageCanvas.tsx

@@ -38,9 +38,18 @@ export const ImageCanvas: React.FC = () => {
 
   // 加载图像并在 canvasImage 变化时自动适应
   useEffect(() => {
+    let img: HTMLImageElement | null = null;
+    
     if (canvasImage) {
-      const img = new window.Image();
+      img = new window.Image();
+      let isCancelled = false;
+      
       img.onload = () => {
+        // 检查是否已取消
+        if (isCancelled) {
+          return;
+        }
+        
         setImage(img);
         
         // 每次有新图像时都自动适应画布，而不仅仅是在初始状态下
@@ -59,10 +68,26 @@ export const ImageCanvas: React.FC = () => {
         // 居中图像
         setCanvasPan({ x: 0, y: 0 });
       };
+      
+      img.onerror = () => {
+        if (!isCancelled) {
+          console.error('图像加载失败');
+        }
+      };
+      
       img.src = canvasImage;
     } else {
       setImage(null);
     }
+    
+    // 清理函数
+    return () => {
+      // 取消图像加载
+      if (img) {
+        img.onload = null;
+        img.onerror = null;
+      }
+    };
   }, [canvasImage, stageSize, setCanvasZoom, setCanvasPan]);
 
   // 处理舞台大小调整