diff --git a/src/image/README.en-US.md b/src/image/README.en-US.md
index b7c76178f..46e7da93d 100644
--- a/src/image/README.en-US.md
+++ b/src/image/README.en-US.md
@@ -32,6 +32,8 @@ className | Description
-- | --
t-class | \-
t-class-load | \-
+t-class-image | \-
+t-class-error | \-
### CSS Variables
diff --git a/src/image/README.md b/src/image/README.md
index a047a0228..55be345c2 100644
--- a/src/image/README.md
+++ b/src/image/README.md
@@ -77,6 +77,8 @@ load | - | 图片加载完成时触发
-- | --
t-class | 根节点样式类
t-class-load | 加载样式类
+t-class-image | 图片样式类
+t-class-error | 加载失败样式类
### CSS Variables
diff --git a/src/image/image.less b/src/image/image.less
index 1e35a0420..c05781707 100644
--- a/src/image/image.less
+++ b/src/image/image.less
@@ -5,13 +5,14 @@
@image-loading-color: var(--td-image-loading-color, @text-color-placeholder);
@image-round-radius: var(--td-image-round-radius, @radius-default);
-:host {
+.@{prefix}-image {
position: relative;
-}
+ display: inline-block;
-.@{prefix}-image {
- color: @image-color;
- vertical-align: top;
+ &__img {
+ color: @image-color;
+ vertical-align: top;
+ }
&__mask {
display: flex;
@@ -34,6 +35,7 @@
&--lazy {
position: absolute;
top: 0;
+ left: 0;
z-index: -1;
}
diff --git a/src/image/image.ts b/src/image/image.ts
index b84da048a..980929d03 100644
--- a/src/image/image.ts
+++ b/src/image/image.ts
@@ -7,7 +7,7 @@ const { prefix } = config;
const name = `${prefix}-image`;
@wxComponent()
export default class Image extends SuperComponent {
- externalClasses = [`${prefix}-class`, `${prefix}-class-load`];
+ externalClasses = [`${prefix}-class`, `${prefix}-class-load`, `${prefix}-class-image`, `${prefix}-class-error`];
options = {
multipleSlots: true,
diff --git a/src/image/image.wxml b/src/image/image.wxml
index 2a519cdbb..6507ef766 100644
--- a/src/image/image.wxml
+++ b/src/image/image.wxml
@@ -1,52 +1,56 @@
-
-
-
-
- {{loading}}
+
+
+
+
+
+ {{loading}}
+
+
-
-
-
-
-
-
+
+
+
+
+
+
+ {{error}}
+
+
- {{error}}
-
+
+
-
-
diff --git a/src/progress/progress.ts b/src/progress/progress.ts
index b9342f33f..574e7055b 100644
--- a/src/progress/progress.ts
+++ b/src/progress/progress.ts
@@ -67,11 +67,6 @@ export default class Progress extends SuperComponent {
});
},
- theme(theme) {
- if (theme === 'circle') {
- this.getInnerDiameter();
- }
- },
trackColor(trackColor) {
this.setData({
@@ -80,17 +75,4 @@ export default class Progress extends SuperComponent {
},
};
- methods = {
- getInnerDiameter() {
- const { strokeWidth } = this.properties;
- const wrapID = `.${name}__canvas--circle`;
- if (strokeWidth) {
- getRect(this, wrapID).then((wrapRect) => {
- this.setData({
- innerDiameter: wrapRect.width - unitConvert(strokeWidth) * 2,
- });
- });
- }
- },
- };
}
diff --git a/src/progress/progress.wxml b/src/progress/progress.wxml
index cb8488be8..b84469050 100644
--- a/src/progress/progress.wxml
+++ b/src/progress/progress.wxml
@@ -80,7 +80,7 @@
>