@koi-br/ocr-web-sdk 1.0.34 → 1.0.35

package/package.json

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

package/preview/ImagePreview.vue

@@ -2222,18 +2222,31 @@ const handleContainerResize = () => {
     return;
   }
 
-  // 使用防抖，避免频繁计算
+  // 清除之前的定时器
   if (resizeTimer) {
     clearTimeout(resizeTimer);
+    resizeTimer = null;
   }
 
-  resizeTimer = setTimeout(() => {
+  // 立即计算并应用新的缩放比例，避免过渡期间露出底色
+  // 使用 requestAnimationFrame 确保在浏览器重绘前更新
+  requestAnimationFrame(() => {
     const newScale = calculateAutoFitScale();
-    if (newScale > 0 && Math.abs(newScale - scale.value) > 0.01) {
+    if (newScale > 0) {
+      // 即使变化很小也立即更新，确保过渡期间图片始终填满容器
       scale.value = newScale;
       initialAutoFitScale.value = newScale;
     }
-  }, 150); // 150ms 防抖延迟
+
+    // 在过渡动画完成后再次检查，确保最终状态正确（处理过渡动画期间的连续变化）
+    resizeTimer = setTimeout(() => {
+      const finalScale = calculateAutoFitScale();
+      if (finalScale > 0 && Math.abs(finalScale - scale.value) > 0.01) {
+        scale.value = finalScale;
+        initialAutoFitScale.value = finalScale;
+      }
+    }, 350); // 350ms 延迟，略大于过渡动画时间（300ms），确保过渡完成后稳定
+  });
 };
 
 /**
@@ -2262,8 +2275,12 @@ onMounted(() => {
   // 监听容器尺寸变化（用于响应外部收起/展开操作）
   nextTick(() => {
     if (containerRef.value && typeof ResizeObserver !== 'undefined') {
-      resizeObserver = new ResizeObserver(() => {
-        handleContainerResize();
+      resizeObserver = new ResizeObserver((entries) => {
+        // 使用 entries 参数立即获取新尺寸，避免延迟
+        for (const entry of entries) {
+          // 立即响应尺寸变化，避免过渡期间露出底色
+          handleContainerResize();
+        }
       });
       resizeObserver.observe(containerRef.value);
     } else {
@@ -2373,6 +2390,8 @@ defineExpose({
   margin: 0;
   padding: 0;
   line-height: 0;
+  // 添加平滑过渡，避免切换时露出底色
+  transition: transform 0.3s ease;
 
   img {
     display: block; // 移除图片底部默认间隙