Skip to content

MethodExists/dva-ant-breadcrumbs

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

38 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

dva-ant-breadcrumbs

Antd’s Breadcrumb component connected to dva router.

Installation

npm i @methodexists/dva-ant-breadcrumbs

Usage

Put <Breadcrumbs /> component inside render method of your route component:

const UsersPage = ({ routes, params }) => (
  <div>
    <Breadcrumbs routes={routes} params={params} />
  </div>
);

Zero configuraton

The component will analyze route’s path and will try to guess the best title for each bread crumb.

URL Path Guessed titles
/userProfile userProfile "User Profile"
/users users "Users"
/users/ilya users/:username "Users" / "Ilya"
/users/9jerb users/:id "Users" / "9jerb" (here you’ll need customization)

Custom static title

Add title prop to a route and it will be used for bread crumb’s title.

<Route path="userProfile" title="My Profile" ... />

Custom dynamic title

Add getTitle prop to calculate bread crumb’s title basing on params from the router and state.

<Route path=":id" getTitle={(params, state) => state.users[params.id].name} />

Fallbacks

If getTitle() prop is undefined or returns undefined then use title.
If title is undefined then guess title from path.

API

Routes API

Prop Type Description
* path string Route’s path. If undefined, the route will be skipped. Could be param name like :username
getTitle (params, state) => string Function to generate route’s title basing on params prop from router and current state
title string Text to use for route’s title

<Breadcrumbs /> API

Prop Description
* routes routes prop provided by router into root route component
* params params prop provided by router into root route component

* required

Also supports Ant Design Breadcrumb component props: prefixCls, separator, itemRender, style, className.

Contributing

See CONTRIBUTING.md for how to develop a component.

About

Antd’s Breadcrumb component connected to dva router

Resources

Stars

Watchers

Forks

Packages

No packages published