监听图片加载错误事件解决头像加载失败

src/layout/components/Navbar.vue

@@ -11,7 +11,7 @@
     <div class="right-menu">
       <el-dropdown class="avatar-container" trigger="click">
         <div class="avatar-wrapper">
-          <img src="$store.getters.staffPhoto" class="user-avatar">
+          <img src="$store.getters.staffPhoto" class="user-avatar" @error="photoErrorHandle">
           <span class="name">{{ $store.getters.name }}</span>
           <i class="el-icon-caret-bottom" style="color:#fff" />
         </div>
@@ -54,6 +54,11 @@ export default {
     async logout() {
       await this.$store.dispatch('user/logout')
       this.$router.push(`/login?redirect=${this.$route.fullPath}`)
+    },
+    // 头像加载失败处理
+    photoErrorHandle(e) {
+      // console.log(e.target)
+      e.target.src = 'https://dss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1851283359,3457678391&fm=26&gp=0.jpg'
     }
   }
 }