fixed #5136

examples/routers/avatar.vue

@@ -32,6 +32,8 @@
         </div>
         <br><br><br>
         <Avatar custom-icon="ivu-icon-ios-person" />
+
+        <Avatar :src="src" size="large" @on-error="handleError" />
     </div>
 </template>
 <script>
@@ -42,7 +44,8 @@
         data () {
             return {
                 user: UserList[0],
-                color: ColorList[0]
+                color: ColorList[0],
+                src: 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj41/avatar'
             }
         },
         methods: {
@@ -50,6 +53,9 @@
                 const index = UserList.indexOf(this.user);
                 this.user = index < UserList.length - 1 ? UserList[index + 1] : UserList[0];
                 this.color = index < ColorList.length - 1 ? ColorList[index + 1] : ColorList[0];
+            },
+            handleError () {
+                this.src = 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar';
             }
         }
     }

src/components/avatar/avatar.vue

@@ -1,6 +1,6 @@
 <template>
     <span :class="classes">
-        <img :src="src" v-if="src">
+        <img :src="src" v-if="src" @error="handleError">
         <Icon :type="icon" :custom="customIcon" v-else-if="icon || customIcon"></Icon>
         <span ref="children" :class="[prefixCls + '-string']" :style="childrenStyle" v-else><slot></slot></span>
     </span>
@@ -89,6 +89,9 @@
                         this.scale = 1;
                     }
                 }
+            },
+            handleError (e) {
+                this.$emit('on-error', e);
             }
         },
         mounted () {