5

Navigating through the File

Tree and Loading Folders from

the URL

In Chapter 4, Getting a List of Files Using the Dropbox API, we created an app that listed the

file and folder contents of a specified Dropbox folder. We now need to make our app easy
to navigate. This means the user will be able to click the folder names to navigate into and

list the contents of, and also give the user the ability to download the file.

Before you proceed, ensure you have the Vue and Dropbox JavaScript files included in

your HTML.

In this chapter, we are going to be:

Creating a component for both files and folders

Adding links to the folder component to update the directory listing

Adding a download button to the file component

Creating a breadcrumb component, so the user can easily navigate back up the

tree

Dynamically updating the browser URL, so if a folder is bookmarked or a link

shared, the correct folder loads