Skip to main content

Breadcrumb

A breadcrumb displays the current location within a hierarchy. It allows going back to states higher up in the hierarchy.

When To Use#

  • When the system has more than two layers in a hierarchy.
  • When you need to inform the user of where they are.
  • When the user may need to navigate back to a higher level.
  • When the application has multi-layer architecture.

Examples#

import { Breadcrumb } from 'tailor-ui';

Basic#

handle onClick#

Overflow#

API#

PropertyDescriptionTypeDefault
itemsBreadcrumb configurationBreadcrumb[]

Breadcrumb item#

PropertyDescriptionTypeDefault
keykeystring
namedisplay nameReactNode
onClickset the handler to handle click event(event: MouseEvent) => void