Commit 6e56098a authored by unrealsmart's avatar unrealsmart Committed by ddcat1115

breadcrumb separator custom (#811)

* Slider breakpoint: md => lg

* breadcrumb separator custom
parent fd031535
...@@ -43,10 +43,13 @@ export default class PageHeader extends PureComponent { ...@@ -43,10 +43,13 @@ export default class PageHeader extends PureComponent {
// Generated according to props // Generated according to props
conversionFromProps= () => { conversionFromProps= () => {
const { const {
breadcrumbList, linkElement = 'a', breadcrumbList, breadcrumbSeparator, linkElement = 'a',
} = this.props; } = this.props;
return ( return (
<Breadcrumb className={styles.breadcrumb}> <Breadcrumb
className={styles.breadcrumb}
separator={breadcrumbSeparator}
>
{breadcrumbList.map(item => ( {breadcrumbList.map(item => (
<Breadcrumb.Item key={item.title}> <Breadcrumb.Item key={item.title}>
{item.href ? (createElement(linkElement, { {item.href ? (createElement(linkElement, {
...@@ -58,7 +61,7 @@ export default class PageHeader extends PureComponent { ...@@ -58,7 +61,7 @@ export default class PageHeader extends PureComponent {
); );
} }
conversionFromLocation = (routerLocation, breadcrumbNameMap) => { conversionFromLocation = (routerLocation, breadcrumbNameMap) => {
const { linkElement = 'a' } = this.props; const { breadcrumbSeparator, linkElement = 'a' } = this.props;
// Convert the path to an array // Convert the path to an array
const pathSnippets = routerLocation.pathname.split('/').filter(i => i); const pathSnippets = routerLocation.pathname.split('/').filter(i => i);
// Loop data mosaic routing // Loop data mosaic routing
...@@ -84,7 +87,10 @@ export default class PageHeader extends PureComponent { ...@@ -84,7 +87,10 @@ export default class PageHeader extends PureComponent {
</Breadcrumb.Item> </Breadcrumb.Item>
); );
return ( return (
<Breadcrumb className={styles.breadcrumb}> <Breadcrumb
className={styles.breadcrumb}
separator={breadcrumbSeparator}
>
{extraBreadcrumbItems} {extraBreadcrumbItems}
</Breadcrumb> </Breadcrumb>
); );
...@@ -94,7 +100,7 @@ export default class PageHeader extends PureComponent { ...@@ -94,7 +100,7 @@ export default class PageHeader extends PureComponent {
* Convert parameters into breadcrumbs * Convert parameters into breadcrumbs
*/ */
conversionBreadcrumbList = () => { conversionBreadcrumbList = () => {
const { breadcrumbList } = this.props; const { breadcrumbList, breadcrumbSeparator } = this.props;
const { routes, params, routerLocation, breadcrumbNameMap } = this.getBreadcrumbProps(); const { routes, params, routerLocation, breadcrumbNameMap } = this.getBreadcrumbProps();
if (breadcrumbList && breadcrumbList.length) { if (breadcrumbList && breadcrumbList.length) {
return this.conversionFromProps(); return this.conversionFromProps();
...@@ -108,6 +114,7 @@ export default class PageHeader extends PureComponent { ...@@ -108,6 +114,7 @@ export default class PageHeader extends PureComponent {
routes={routes.filter(route => route.breadcrumbName)} routes={routes.filter(route => route.breadcrumbName)}
params={params} params={params}
itemRender={this.itemRender} itemRender={this.itemRender}
separator={breadcrumbSeparator}
/> />
); );
} }
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment