O'Reilly logo

Vue.js 2.x by Example by Mike Street

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Updating the structure with a URL change and setting Vue data outside of the instance

Now that we have our URL updating correctly, we can get the new structure whenever the hash changes. This can be done natively with JavaScript with the onhashchange function.

We are going to create a function that fires whenever the hash of the URL updates, which, in turn, will update a path variable on the parent Vue instance. This variable will be passed to the child dropbox-viewer component as a prop. This component will be watching for a change in the variable and, upon update, it will retrieve the new structure.

To begin with, update the parent Vue instance to have a data object with a path key - set to the empty string property. We are also going to ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required