路由懒加载

什么是路由懒加载

路由懒加载就是指通过异步的方式来加载对应的路由组件

有什么好处

可以提高页面加载的速度,尤其是首页加载速度(因为使用了懒加载收,加载首页的时候,就不需要加载其他页面对应的组件,在需要的时候在加载)

如何使用

export const constantRoutes = [
  {
    path: '/login',
    component: () => import('@/views/login/index'),
    hidden: true
  },

  {
    path: '/404',
    component: () => import('@/views/404'),
    hidden: true
  },

  {
    path: '/',
    component: Layout,
    redirect: '/dashboard',
    children: [{
      path: 'dashboard',
      name: 'Dashboard',
      component: () => import('@/views/dashboard/index'),
      meta: { title: 'Dashboard', icon: 'dashboard' }
    }]
  }
  ]

类似于将一个路由组件进行封装当需要哪个组件是进行调用,这样减轻了客户端的压力,用最初的方法直接写当进入页面其他路由组件也会一起加载,这样加大了客户端的压力所以路由懒加载这样的方式对客户端很友好加长了使用寿命