Breadcrumb

Documentation

JavaScript

var Components = require("gd-sprest-bs").Components;

// Create the breadcrumb
var el = document.querySelector("#breadcrumb");
var breadcrumb = Components.Breadcrumb({
    el: el,
    items: [
        { text: "Root", href: "/" },
        { text: "Web 1", href: "/web" },
        { text: "Web 1-1", href: "/web/1" }
    ]
});

TypeScript

import { Components } from "gd-sprest-bs";

// Create the breadcrumb
let el = document.querySelector("#breadcrumb");
let breadcrumb = Components.Breadcrumb({
    el: el,
    items: [
        { text: "Root", href: "/" },
        { text: "Web 1", href: "/web" },
        { text: "Web 1-1", href: "/web/1" }
    ]
});

Web Component

// Return the breadcrumb properties return { items: [ { "text": "Root", "href": "/" }, { "text": "Web 1", "href": "/web" }, { "text": "Web 1-1", "href": "/web/1"} ] }
<script type="text/javascript" src="https://unpkg.com/gd-sprest-bs/wc/dist/gd-sprest-bs.js"></script>
<bs-breadcrumb>
    // Return the breadcrumb properties
    return {
        items: [
            { "text": "Root", "href": "/" }, 
            { "text": "Web 1", "href": "/web" }, 
            { "text": "Web 1-1", "href": "/web/1"}
        ]
    }
</bs-breadcrumb>

References

Breadcrumb(props:IBreadcrumbProps):IBreadcrumb

IBreadcrumb

Name Returns Description
el Element The jquery element.

IBreadcrumbProps

Name Type Description
className string The class name to apply to breadcrumb.
el HTMLElement The element to render the breadcrumb to.
items Array<IBreadcrumbItem> An array of breadcrumb items._

IBreadcrumbItem

Name Type Description
href string The breadcrumb item url.
text string The breadcrumb item text.