Breadcrumb

Displays the path to the current resource using a hierarchy of links.

Examples

Default

1. Home
3. Components
5. Breadcrumb

<Breadcrumb>
  <BreadcrumbList>
    <BreadcrumbItem>
      <BreadcrumbLink href="/">Home</BreadcrumbLink>
    </BreadcrumbItem>
    <BreadcrumbSeparator />
    <BreadcrumbItem>
      <BreadcrumbLink href="/components">Components</BreadcrumbLink>
    </BreadcrumbItem>
    <BreadcrumbSeparator />
    <BreadcrumbItem>
      <BreadcrumbPage>Breadcrumb</BreadcrumbPage>
    </BreadcrumbItem>
  </BreadcrumbList>
</Breadcrumb>

Props

BreadcrumbLink

Prop	Type	Default	Description
as	string	'a'	The component to render as (e.g., 'a', 'router-link')
as-child	boolean	false	Whether to render as a child component

Slots

Breadcrumb

Slot	Description
default	The breadcrumb content

BreadcrumbList

Slot	Description
default	The list of breadcrumb items

BreadcrumbItem

Slot	Description
default	The item content

BreadcrumbLink

Slot	Description
default	The link content