Breadcrumbs

The v-breadcrumbs component is used as a navigational helper and hierarchy for pages.

Usage

By default, breadcrumbs use a text divider. This can be any string.

TIP

Use slots for more control of the breadcrumbs, either utilizing v-breadcrumbs-item or other custom markup.

API

Component	Description
v-breadcrumbs	Primary Component
v-breadcrumbs-item	Sub-component used for each breadcrumb
v-breadcrumbs-divider	Sub-component used for dividing breadcrumbs

INFO

By default v-breadcrumbs will disable all crumbs up to the current page in a nested paths. You can prevent this behavior by using exact: true on each applicable breadcrumb in the items array.

Examples

Props

Divider

Breadcrumbs separator can be set using divider property.

Slots

Prepend

Prepend content with the prepend slot.

Dividers

To customize the divider, use the divider slot.

Title

You can use the title slot to customize each breadcrumb title.