Works with multi-level paths without the need for child views. For example: "/foo/bar" and "/foo/boo" or even "/foo/:id" can all be used at the same level with a single router-view. Supports child views too.
Requires: vue-router.
https://nxtchg.github.io/pieces/vue/vs-crumbs/#/foo/bar
- root - name of the root element, default is 'home'
Simply add 'vs-crumbs.js' file into your project and insert one or more tags anywhere:
<vs-crumbs></vs-crumbs>
Then style your separator:
.vs-crumbs a:after{ padding: 0 12px; color: #888; content: "/"; }
By default, the component uses router path to display breadcrumb names.
You can override this with custom names by using meta.crumbs:
{ path: '/foo/bar', component: FooBar, meta: { crumbs: '/My Foo/My Bar'} }
This component also sets page title to "home : foo : bar".
See the "test/index.html" file for more examples of how to use it.