Single Page Applications Chapter 15
next: This is a function we can use when we are ready to go on with the
switching of the route. Calling this function with false will prevent the route
from being changed, and it is useful in case of errors.
When the preceding functions are called, we made a call with Axios to a web service that
provided a string for a name and a string for a phone number.
When we are inside this hook, it's important to remember that we don't have access to this.
It's because this hook runs before the component is actually instantiated, so there is no this
to refer to.
When the server responds, we are inside the then function and want to assign the name
and phone returned from the server but, as said, we don't have access to this. The next
function receives a reference to our component as an argument. We use this to set the
variables to the received value:
}).then(response => {
next(vm => {
vm.name = response.data.name
vm.phone = response.data.phone
})
})
Using named dynamic routes
Registering all the routes by hand can be time consuming and, when the routes are not
known in advance, it is impossible. vue-router lets you register routes with an argument so
that you can have links for all the objects in a database and cover other use-cases where the
user chooses a route, following some pattern that will result in too many routes to be
registered by hand.
Getting ready
Except for the basics on vue-router (refer to the Creating an SPA with vue-router recipe), you
won't need any additional information to complete this recipe.