From 0b66360cc9f60c5064be4c3cae39091541f3be8c Mon Sep 17 00:00:00 2001
From: Vben <anncwb@126.com>
Date: Sat, 27 Mar 2021 21:33:13 +0800
Subject: [PATCH] fix(breadcrumb): ensure the breadcrumbs display the icon
 correctly, fix #433

---
 CHANGELOG.zh_CN.md                                   | 4 ++++
 src/layouts/default/header/components/Breadcrumb.vue | 8 ++++++--
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md
index 6ddcde324fa..3b6d2c744bb 100644
--- a/CHANGELOG.zh_CN.md
+++ b/CHANGELOG.zh_CN.md
@@ -8,6 +8,10 @@
 
 - 移除 useFullScreen 函数
 
+### 🐛 Bug Fixes
+
+- 确保面包屑正确的显示图标
+
 ## 2.1.1 (2021-03-26)
 
 ### ✨ Features
diff --git a/src/layouts/default/header/components/Breadcrumb.vue b/src/layouts/default/header/components/Breadcrumb.vue
index 3496ad501a2..1323258976d 100644
--- a/src/layouts/default/header/components/Breadcrumb.vue
+++ b/src/layouts/default/header/components/Breadcrumb.vue
@@ -2,7 +2,7 @@
   <div :class="[prefixCls, `${prefixCls}--${theme}`]">
     <a-breadcrumb :routes="routes">
       <template #itemRender="{ route, routes, paths }">
-        <Icon :icon="route.meta.icon" v-if="getShowBreadCrumbIcon && route.meta.icon" />
+        <Icon :icon="getIcon(route)" v-if="getShowBreadCrumbIcon && getIcon(route)" />
         <span v-if="!hasRedirect(routes, route)">
           {{ t(route.name || route.meta.title) }}
         </span>
@@ -146,7 +146,11 @@
         return true;
       }
 
-      return { routes, t, prefixCls, getShowBreadCrumbIcon, handleClick, hasRedirect };
+      function getIcon(route) {
+        return route.icon || route.meta?.icon;
+      }
+
+      return { routes, t, prefixCls, getIcon, getShowBreadCrumbIcon, handleClick, hasRedirect };
     },
   });
 </script>