Appearance
useBreadcrumbs ​
Definition ​
Composable for breadcrumbs management. Read the guide.
It's recommended to use getCategoryBreadcrumbs for category breadcrumbs.
Basic usage ​
ts
const {  breadcrumbs, clearBreadcrumbs } = useBreadcrumbs(newBreadcrumbs);
Signature ​
ts
export function useBreadcrumbs(
  newBreadcrumbs?: Breadcrumb[],
): UseBreadcrumbsReturn 
Parameters ​
| Name | Type | Description | 
|---|---|---|
| newBreadcrumbs | Array<Breadcrumb> | 
Return type ​
See UseBreadcrumbsReturn
ts
export type UseBreadcrumbsReturn = {
  /**
   * Clear breadcrumbs store
   */
  clearBreadcrumbs(): void;
  /**
   * List of breadcrumbs
   */
  breadcrumbs: ComputedRef<Breadcrumb[]>;
};
Properties ​
| Name | Type | Description | 
|---|---|---|
| breadcrumbs | ComputedRef<Array<Breadcrumb>> | List of breadcrumbs | 
Methods ​
| Name | Type | Description | 
|---|---|---|
| clearBreadcrumbs | void | Clear breadcrumbs store | 
Usage ​
vue
<script setup lang="ts">
useBreadcrumbs([
  {
    name: "Home",
    path: "/",
  },
  {
    name: "Top sellers",
    path: "/top-sellers",
  },
]);
</script>