fix(breadcrumb): ensure the breadcrumbs display the icon correctly, fix #433

Vben
1 parent 6bb19fb2
Showing 2 changed files with 10 additions and 2 deletions
CHANGELOG.zh_CN.md
src/layouts/default/header/components/Breadcrumb.vue
@@ -8,6 +8,10 @@
  
 - 移除 useFullScreen 函数
  
+### 🐛 Bug Fixes
+
+- 确保面包屑正确的显示图标
+
 ## 2.1.1 (2021-03-26)
  
 ### ✨ Features
@@ -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>