fix(image): enable dynamic dimension (#2050)

Tencent · May 30, 2023 · f570486 · f570486
1 parent 43dbad6
commit f570486
Showing 1 changed file with 19 additions and 11 deletions.
diff --git a/src/image/image.ts b/src/image/image.ts
@@ -28,18 +28,9 @@ export default class Image extends SuperComponent {
   lifetimes = {
     attached() {
       const { width, height } = this.data;
-      let innerStyle = '';
-      this.update();
 
-      if (width) {
-        innerStyle += `width: ${addUnit(width)};`;
-      }
-      if (height) {
-        innerStyle += `height: ${addUnit(height)};`;
-      }
-      this.setData({
-        innerStyle,
-      });
+      this.update();
+      this.calcSize(width, height);
     },
   };
 
@@ -48,6 +39,9 @@ export default class Image extends SuperComponent {
       if (this.preSrc === this.properties.src) return;
       this.update();
     },
+    'width, height'(width, height) {
+      this.calcSize(width, height);
+    },
   };
 
   methods = {
@@ -84,6 +78,20 @@ export default class Image extends SuperComponent {
       this.triggerEvent('error', e.detail);
     },
 
+    calcSize(width, height) {
+      let innerStyle = '';
+
+      if (width) {
+        innerStyle += `width: ${addUnit(width)};`;
+      }
+      if (height) {
+        innerStyle += `height: ${addUnit(height)};`;
+      }
+      this.setData({
+        innerStyle,
+      });
+    },
+
     update() {
       const { src } = this.properties;
       this.preSrc = src;