Vue Bootstrap Breadcrumb

Vue Breadcrumbs - Bootstrap 4 & Material Design

Vue Bootstrap breadcrumbs indicate on which exact page in the navigational hierarchy your visitors currently are.

They are highly useful in projects, that tend to have a large structure like magazines or documentations.

Examples of Bootstrap breadcrumb use:

Documentation page
Magazine
ERP system

See the following breadcrumbs examples:

Basic breadcrumbs

template
script


        <template>
          <div>
            <mdb-breadcrumb>
              <mdb-breadcrumb-item active>Home</mdb-breadcrumb-item>
            </mdb-breadcrumb>
            <mdb-breadcrumb>
              <mdb-breadcrumb-item><a href="#">Home</a></mdb-breadcrumb-item>
              <mdb-breadcrumb-item active>Library</mdb-breadcrumb-item>
            </mdb-breadcrumb>
            <mdb-breadcrumb>
              <mdb-breadcrumb-item><a href="#">Home</a></mdb-breadcrumb-item>
              <mdb-breadcrumb-item><a href="#">Library</a></mdb-breadcrumb-item>
              <mdb-breadcrumb-item active>Data</mdb-breadcrumb-item>
            </mdb-breadcrumb>
          </div>
        </template>


        <script>
          import { mdbBreadcrumb, mdbBreadcrumbItem } from 'mdbvue';
          export default {
            name: 'Breadcrumb',
            components: {
              mdbBreadcrumb,
              mdbBreadcrumbItem
            }
          }
        </script>

Introduction
Basic breadcrumbs

Warning: file_get_contents(common/gs.html): failed to open stream: No such file or directory in /var/www/html/legacy/vue/5.8.3/index.php on line 143

Warning

/var/www/html/legacy/vue/5.8.3/index.php

143