How to use the react-router-breadcrumbs-hoc function in react-router-breadcrumbs-hoc
To help you get started, we’ve selected a few react-router-breadcrumbs-hoc examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
icd2k3 / react-router-breadcrumbs-hoc / types / react-router-breadcrumbs-hoc / react-router-breadcrumbs-hoc-tests.tsx View on Github 
matchOptions: { exact: true, strict: true },
},
];
const Breadcrumbs = ({ breadcrumbs }: InjectedProps) => (
<div>
{breadcrumbs.map(({ breadcrumb, match }: BreadcrumbsProps, index: number) => (
<span>
{breadcrumb}
{index < breadcrumbs.length - 1 && <i> / </i>}
</span>
))}
</div>
);
export default withBreadcrumbs(routes)(Breadcrumbs);{breadcrumbs.map(({ match, breadcrumb }, index) => (
<span>
{index > 0 ? ' > ' : null}
{index < breadcrumbs.length - 1 ? (
{breadcrumb}
) : (
<> {breadcrumb}
)}
</span>
))}
)
export default withBreadcrumbs(routes, { disableDefaults: true })(Breadcrumbs)import withBreadcrumbs from 'react-router-breadcrumbs-hoc';
import Breadcrumbs from './Breadcrumbs';
import BrowserBreadcrumb from './BrowserBreadcrumb';
const routes = [
{ path: '/browser/:query+', breadcrumb: BrowserBreadcrumb }
];
export default withBreadcrumbs(routes, { excludePaths: ['/'] })(Breadcrumbs);export const Navigation = ({
routes
}: {
routes?: Array;
}) => {
const newRoutes = [...routesConfig, ...(routes || [])];
const breadcrumbs = withBreadcrumbs(newRoutes, {
excludePaths: ["/"]
})(({ breadcrumbs }) => {
return (
<div style="{{">
{breadcrumbs.map(({ match, breadcrumb }, index) => (
<span>
{index !== 0 && ` > `} {breadcrumb}
</span>
))}
</div>
);
});
return React.createElement(breadcrumbs);
};react-router-breadcrumbs-hoc
small, flexible, higher order component for rendering breadcrumbs with react-router 4.x
