@koi-br/ocr-web-sdk 1.0.38 → 1.0.39

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koi-br/ocr-web-sdk",
-  "version": "1.0.38",
+  "version": "1.0.39",
   "description": "一个支持多种Office文件格式预览的Vue3组件SDK，包括PDF、Word、Excel、图片、OFD、TIF等格式",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",

package/preview/ImagePreview.vue

@@ -967,32 +967,48 @@ const onImageLoad = (event: Event, pageNum: number) => {
     // 重置用户缩放标记
     isUserZooming.value = false;
     
-    // 隐藏图片，显示 loading
-    isImageReady.value = false;
-    isCalculatingAutoFit.value = true;
+    // 确保图片是隐藏的（watch 已经设置了，这里再次确认）
+    if (!isImageReady.value) {
+      isCalculatingAutoFit.value = true;
+    }
+
+    // 设置超时保护，防止一直显示 loading（最多等待 3 秒）
+    const timeoutId = setTimeout(() => {
+      console.warn('自适应宽度计算超时，强制显示图片');
+      isCalculatingAutoFit.value = false;
+      isImageReady.value = true;
+    }, 3000);
 
     // 使用双重 nextTick 确保容器尺寸已确定
     nextTick(() => {
       nextTick(() => {
         // 添加小延迟确保容器完全渲染
         setTimeout(() => {
-          const autoScale = calculateAutoFitScale();
-          if (autoScale !== 1 && autoScale > 0) {
-            scale.value = autoScale;
-            initialAutoFitScale.value = autoScale; // 记录初始自适应缩放比例
+          try {
+            const autoScale = calculateAutoFitScale();
+            if (autoScale > 0) {
+              scale.value = autoScale;
+              initialAutoFitScale.value = autoScale; // 记录初始自适应缩放比例
+            }
+          } catch (error) {
+            console.warn('计算自适应宽度失败:', error);
+          } finally {
+            // 清除超时保护
+            clearTimeout(timeoutId);
+            // 无论计算结果如何，都要更新状态，避免一直显示 loading
+            isCalculatingAutoFit.value = false;
+            // 使用 requestAnimationFrame 确保在下一帧显示，避免闪烁
+            requestAnimationFrame(() => {
+              isImageReady.value = true;
+            });
           }
-          // 计算完成后，显示图片并隐藏 loading
-          isCalculatingAutoFit.value = false;
-          // 使用 requestAnimationFrame 确保在下一帧显示，避免闪烁
-          requestAnimationFrame(() => {
-            isImageReady.value = true;
-          });
         }, 100); // 增加延迟，确保所有图片都已加载
       });
     });
   } else if (!props.autoFitWidth) {
     // 如果没有启用自适应宽度，立即显示图片
     isImageReady.value = true;
+    isCalculatingAutoFit.value = false;
   }
   
   // 如果第一页已经加载完成，且当前页不是第一页，也应用自适应宽度
@@ -2353,19 +2369,34 @@ onMounted(() => {
       // 隐藏图片，显示 loading
       isImageReady.value = false;
       isCalculatingAutoFit.value = true;
+      
+      // 设置超时保护，防止一直显示 loading（最多等待 3 秒）
+      const timeoutId = setTimeout(() => {
+        console.warn('自适应宽度计算超时，强制显示图片');
+        isCalculatingAutoFit.value = false;
+        isImageReady.value = true;
+      }, 3000);
+      
       nextTick(() => {
         nextTick(() => {
           setTimeout(() => {
-            const autoScale = calculateAutoFitScale();
-            if (autoScale !== 1 && autoScale > 0) {
-              scale.value = autoScale;
-              initialAutoFitScale.value = autoScale;
+            try {
+              const autoScale = calculateAutoFitScale();
+              if (autoScale > 0) {
+                scale.value = autoScale;
+                initialAutoFitScale.value = autoScale;
+              }
+            } catch (error) {
+              console.warn('计算自适应宽度失败:', error);
+            } finally {
+              // 清除超时保护
+              clearTimeout(timeoutId);
+              // 无论计算结果如何，都要更新状态，避免一直显示 loading
+              isCalculatingAutoFit.value = false;
+              requestAnimationFrame(() => {
+                isImageReady.value = true;
+              });
             }
-            // 计算完成后，显示图片并隐藏 loading
-            isCalculatingAutoFit.value = false;
-            requestAnimationFrame(() => {
-              isImageReady.value = true;
-            });
           }, 100);
         });
       });