路由匹配404页面

为了更好的用户体验，需要在用户访问某个路由的时候，如果匹配不上就跳转到另外一个页面。也就是通常所见的404页面。

方式一：

在路由的匹配规则最后加入*，必须放在最后

const routes = [
  {path:'/',redirect:'/home'},
  {
    path: '/home',
    name: 'Home',
    component: Home
  },
  {
    path: '/about',
    name: 'About',
    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
  },
  {
    path: '*',
    name: 'Not Found',
    component: () => import(/* webpackChunkName: "about" */ '../components/error.vue')
  }

 

方式二：

可以在router.beforeEach这个全局路由导航函数用to.matched.length判断有没有这个路由，

0就是没有，然后跳转到登录页面或者404页面