Router 之嵌套路由、路由模式、重定向与懒加载

嵌套路由

定义在children中的路由

//请求嵌套路由时，路由对应组件显示在嵌套路由所在组件位置
const vueRouter = new VueRouter({
    routes:[{
        path:'/',
        component:Home,
        childrent:[  //给Home子路由，设置嵌套路由
            {
                path:'/user',
                component:'user'
            },
        ]
    }] 

路由模式

Vue spa应用（单页应用，只有一个 index.html ，在 public文件夹下

Vue默认路由模式

Hash 模式 “#” ， 页面不会重新加载

    http://localhost/#/……

Router History模式

{
    path:'/',
    mode: 'history'
}

重定向

重定向:redirect 自动跳转

{
    path:'/',
    redirect:'/login'
}

错误处理路由

{
    path:'*',       //写在路由规则末尾
    component: ()=> import(@/views/error404.vue)
}
//error404.vue 写在根路径下（例如：views） 

懒加载

路由懒加载

//@:src
component:() => import('@/')