Breadcrumbs Item
The BreadcrumbsItem component is a navigational helper for pages. It can accept a Material Icons icon or text characters as a divider. An array of objects can be passed to the items property of the component. Additionally, slots exists for more control of the breadcrumbs, either utilizing BreadcrumbsItem or other custom markup.
info
For more details about Vuetify’s usage of BreadcrumbsItem component, click BreadcrumbsItem page.
For more prop explanations, click Vuetify BreadcrumbsItem API page.
Props
| Attribute | Description | Type | Default |
|---|---|---|---|
| class | Allows custom properties to take effect. | string | undefined |
| append | Setting append prop always appends the relative path to the current path. | boolean | false |
| exact | Exactly match the link. Without this, ‘/’ will match every route. | boolean | false |
| href | Designates the component as anchor and applies the href attribute. | string | undefined |
| link | Designates that the component is a link. This is automatic when using the href or to prop. | boolean | false |
| ripple | Applies the ripple directive. | boolean | false |
| replace | Setting replace prop will call router.replace() instead of router.push() when clicked, so the navigation will not leave a history record. You can find more information about the replace prop on the vue-router documentation. | boolean | false |
| tag | Specify a custom tag used on the root element. | string | 'li' |
| target | Designates the target attribute. This should only be applied when using the href prop. | string | undefined |
| to | Denotes the target route of the link. You can find more information about the to prop on the vue-router documentation. | string | undefined |
| visible | Visibility of BreadcrumbItems component. | boolean | true |
| tabIndex | Allows component to give and receive focus. | number | undefined |