Single Page Applications Chapter 15For example, consider that we change our code to the following:
const router = new VueRouter({
routes: [
{ path: '/user/:id', component: User,
children: [
{
path: 'soldiers',
component: Soldiers
},
{
path: '/gold',
component: Gold
}
]
}
]
})Prefixing the /gold route will make the Gold component appear when we point the
browser to the /gold URL instead of /user/Lannister/gold (which will result in an
error and an empty page in this case because the user is not specified).
The other, opposite, case is when having nested routes but no components on the same
level. In this case, just use the regular syntax to register routes.
Using route aliases
Sometimes it's necessary to have multiple URLs that point to the same page. This may be
because the page has changed name or because the page is referred to differently in
different parts of the site.
In particular, when a page changes its name, it is very important to also leave the former
name in many settings. Links may break and the page may become unreachable from some
parts of the website. In this recipe, you will prevent exactly that.
Getting ready
For this recipe, you are only required to have some knowledge of the vue-router
component (how to install it and basic operations). More information about vue-router will
start from the Creating a SPA with vue-router recipe.