当 vuejs 中不存在路由器链接时重定向到页面

Question

路由器链接定义如下：

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

当定义的链接以外的链接被称为'/contact' ，必须将其重定向到'/' 。 有没有一种方法比导航卫士其他类似我们使用.otherwise在角路线？

Answer 1

在 routconfig 数组中添加{path: '*', component: () => import('../views/PageNotFound.vue')} ，其中PageNotFound只是另一个组件。 您可以在 PageNotFound 组件中添加任何您喜欢的内容或将其命名为其他名称。 将其添加为数组中的最后一个元素