Fix breadcrumb 404 link, close #343

src/components/PageHeader/index.js

@@ -6,23 +6,23 @@ import styles from './index.less';
 
 const { TabPane } = Tabs;
 
-function getBreadcrumbName(breadcrumbNameMap, url) {
-  if (breadcrumbNameMap[url] && breadcrumbNameMap[url].name) {
-    return breadcrumbNameMap[url].name;
+function getBreadcrumb(breadcrumbNameMap, url) {
+  if (breadcrumbNameMap[url]) {
+    return breadcrumbNameMap[url];
   }
   const urlWithoutSplash = url.replace(/\/$/, '');
-  if (breadcrumbNameMap[urlWithoutSplash] && breadcrumbNameMap[urlWithoutSplash].name) {
-    return breadcrumbNameMap[urlWithoutSplash].name;
+  if (breadcrumbNameMap[urlWithoutSplash]) {
+    return breadcrumbNameMap[urlWithoutSplash];
   }
-  let breadcrumbName = '';
+  let breadcrumb = '';
   Object.keys(breadcrumbNameMap).forEach((item) => {
     const itemRegExpStr = `^${item.replace(/:[\w-]+/g, '[\\w-]+')}$`;
     const itemRegExp = new RegExp(itemRegExpStr);
     if (itemRegExp.test(url)) {
-      breadcrumbName = breadcrumbNameMap[item].name;
+      breadcrumb = breadcrumbNameMap[item];
     }
   });
-  return breadcrumbName || url;
+  return breadcrumb;
 }
 
 export default class PageHeader extends PureComponent {
@@ -76,12 +76,14 @@ export default class PageHeader extends PureComponent {
       const pathSnippets = location.pathname.split('/').filter(i => i);
       const extraBreadcrumbItems = pathSnippets.map((_, index) => {
         const url = `/${pathSnippets.slice(0, index + 1).join('/')}`;
+        const currentBreadcrumb = getBreadcrumb(breadcrumbNameMap, url);
+        const isLinkable = (index !== pathSnippets.length - 1) && currentBreadcrumb.component;
         return (
           <Breadcrumb.Item key={url}>
             {createElement(
-              (index === pathSnippets.length - 1) ? 'span' : linkElement,
+              isLinkable ? linkElement : 'span',
               { [linkElement === 'a' ? 'href' : 'to']: url },
-              getBreadcrumbName(breadcrumbNameMap, url),
+              currentBreadcrumb.name || url,
             )}
           </Breadcrumb.Item>
         );