Mithun raj
Mithun raj

Reputation: 194

Redirect to a page when router link does not exist in vuejs

Router links have been defined like:

const routes: Array<RouteConfig> = [
  {
    path: '/',
    name: 'Home',
    component: () => import('../views/Home.vue')
  },
  {
    path: '/about',
    name: 'About',
    component: () => import('../views/About.vue')
  }
]

when links other than the defined ones are called like '/contact', have to redirect it to '/'. Is there a way other than navigation guards like we use .otherwise in angular routes?

Upvotes: 0

Views: 1191

Answers (1)

Emmanuel Ogoma
Emmanuel Ogoma

Reputation: 582

add {path: '*', component: () => import('../views/PageNotFound.vue')} in the routconfig array, where PageNotFoundis just another component. You can add anything stuff you like in the PageNotFound component or name it to something else. Add it as last element in the array

Upvotes: 2

Related Questions