Creating a breadcrumb from the current path

When navigating through folders or a nested structure of any kind, it's always nice to have a breadcrumb available so the user knows where they are, how far they've gone, and also so they can get back to a previous folder easily. We are going to make a component for the breadcrumb as it is going to feature various properties, computed functions, and methods.

The breadcrumb component is going to list each folder depth as a link to a folder icon. Clicking the link will take the user directly to that folder - even if it is several layers up. To achieve this, we will need to have a list of links we can loop through, each with two properties - one being the full path to the folder and the other just ...

Get Vue.js 2.x by Example now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.