There may be times you want to have links to children pages. For example /about/meet-the-team. Fortunately, there is not much work required to get this working. Create a new object in the routes array, pointing to a new component with a template:
const router = new VueRouter({
routes: [
{
path: '/',
component: Home
},
{
path: '/about',
component: About
},
{
path: '/about/meet-the-team',
component: MeetTheTeam
}
],
linkActiveClass: 'active',
linkExactActiveClass: 'current'
});
When navigating to this page, you will notice both the Home and About links have the active class and neither have the current class we created. If you were to create a link in your navigation to this page, a current class would be applied to that.