diff --git a/packages/avatar/src/index.vue b/packages/avatar/src/index.vue
index 685c04bd1f..95d87555f3 100644
--- a/packages/avatar/src/index.vue
+++ b/packages/avatar/src/index.vue
@@ -14,7 +14,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, computed, ref, PropType } from 'vue'
+import { defineComponent, computed, ref, PropType, watch, toRefs } from 'vue'
 
 const ERROR_EVENT = 'error'
 export default defineComponent({
@@ -50,6 +50,12 @@ export default defineComponent({
   setup(props, { emit }) {
     const hasLoadError = ref(false)
 
+    const { src } = toRefs(props)
+    // need reset hasLoadError to false if src changed
+    watch(src,()=>{
+      hasLoadError.value = false
+    })
+
     const avatarClass = computed(() => {
       const { size, icon, shape } = props
       let classList = ['el-avatar']