fix: 修复 image 组件使用 transform 样式后，大小计算错误的问题

packages/uni-app-plus/dist/uni-app-view.umd.js

@@ -6152,12 +6152,9 @@
     });
     watch(() => extend({}, size2), (value) => emit2("resize", value));
     return () => {
-      const {
-        width,
-        height
-      } = rootRef.value.getBoundingClientRect();
-      size2.width = width;
-      size2.height = height;
+      const rootEl = rootRef.value;
+      size2.width = rootEl.offsetWidth;
+      size2.height = rootEl.offsetHeight;
       reset2();
     };
   }
@@ -6278,8 +6275,8 @@
     }
   };
   const FIX_MODES = {
-    widthFix: ["width", "height"],
-    heightFix: ["height", "width"]
+    widthFix: ["offsetWidth", "height"],
+    heightFix: ["offsetHeight", "width"]
   };
   const IMAGE_MODES = {
     aspectFit: ["center center", "contain"],
@@ -6449,8 +6446,7 @@
         return;
       }
       const rootEl = rootRef.value;
-      const rect = rootEl.getBoundingClientRect();
-      const value = rect[names[0]];
+      const value = rootEl[names[0]];
       if (value) {
         rootEl.style[names[1]] = fixNumber(value / ratio) + "px";
       }

packages/uni-components/src/components/image/index.tsx

@@ -37,8 +37,8 @@ type ImageState = ReturnType<typeof useImageState>
 type FixSize = ReturnType<typeof useImageSize>['fixSize']
 
 const FIX_MODES = {
-  widthFix: ['width', 'height'],
-  heightFix: ['height', 'width'],
+  widthFix: ['offsetWidth', 'height'],
+  heightFix: ['offsetHeight', 'width'],
 }
 const IMAGE_MODES = {
   aspectFit: ['center center', 'contain'],
@@ -76,6 +76,7 @@ export default /*#__PURE__*/ defineBuiltInComponent({
           <div style={modeStyle} />
           {imgSrc ? <img src={imgSrc} draggable={props.draggable} /> : <img />}
           {FIX_MODES[mode as keyof typeof FIX_MODES] ? (
+            // @ts-ignore
             <ResizeSensor onResize={fixSize} />
           ) : (
             <span></span>
@@ -209,8 +210,7 @@ function useImageSize(
       return
     }
     const rootEl = rootRef.value!
-    const rect = rootEl.getBoundingClientRect()
-    const value = rect[names[0] as keyof DOMRect] as number
+    const value = rootEl[names[0] as 'offsetWidth' | 'offsetHeight']
     if (value) {
       rootEl.style[names[1] as 'height' | 'width'] =
         fixNumber(value / ratio) + 'px'

packages/uni-components/src/components/resize-sensor/index.tsx

@@ -49,9 +49,9 @@ function useResizeSensorUpdate(
     (value: typeof size) => emit('resize', value)
   )
   return () => {
-    const { width, height } = rootRef.value!.getBoundingClientRect()
-    size.width = width
-    size.height = height
+    const rootEl = rootRef.value!
+    size.width = rootEl.offsetWidth
+    size.height = rootEl.offsetHeight
     reset()
   }
 }

packages/uni-h5/dist/uni-h5.cjs.js

@@ -1573,12 +1573,9 @@ function useResizeSensorUpdate(rootRef, emit2, reset) {
   });
   vue.watch(() => shared.extend({}, size), (value) => emit2("resize", value));
   return () => {
-    const {
-      width,
-      height
-    } = rootRef.value.getBoundingClientRect();
-    size.width = width;
-    size.height = height;
+    const rootEl = rootRef.value;
+    size.width = rootEl.offsetWidth;
+    size.height = rootEl.offsetHeight;
     reset();
   };
 }
@@ -2605,8 +2602,8 @@ const props$p = {
   }
 };
 const FIX_MODES = {
-  widthFix: ["width", "height"],
-  heightFix: ["height", "width"]
+  widthFix: ["offsetWidth", "height"],
+  heightFix: ["offsetHeight", "width"]
 };
 const IMAGE_MODES = {
   aspectFit: ["center center", "contain"],
@@ -2764,8 +2761,7 @@ function useImageSize(rootRef, props2, state) {
       return;
     }
     const rootEl = rootRef.value;
-    const rect = rootEl.getBoundingClientRect();
-    const value = rect[names[0]];
+    const value = rootEl[names[0]];
     if (value) {
       rootEl.style[names[1]] = fixNumber(value / ratio) + "px";
     }

packages/uni-h5/dist/uni-h5.es.js

@@ -5780,12 +5780,9 @@ function useResizeSensorUpdate(rootRef, emit2, reset) {
   });
   watch(() => extend({}, size), (value) => emit2("resize", value));
   return () => {
-    const {
-      width,
-      height
-    } = rootRef.value.getBoundingClientRect();
-    size.width = width;
-    size.height = height;
+    const rootEl = rootRef.value;
+    size.width = rootEl.offsetWidth;
+    size.height = rootEl.offsetHeight;
     reset();
   };
 }
@@ -7539,8 +7536,8 @@ const props$w = {
   }
 };
 const FIX_MODES = {
-  widthFix: ["width", "height"],
-  heightFix: ["height", "width"]
+  widthFix: ["offsetWidth", "height"],
+  heightFix: ["offsetHeight", "width"]
 };
 const IMAGE_MODES = {
   aspectFit: ["center center", "contain"],
@@ -7710,8 +7707,7 @@ function useImageSize(rootRef, props2, state2) {
       return;
     }
     const rootEl = rootRef.value;
-    const rect = rootEl.getBoundingClientRect();
-    const value = rect[names[0]];
+    const value = rootEl[names[0]];
     if (value) {
       rootEl.style[names[1]] = fixNumber(value / ratio) + "px";
     }