关于VueRouter重定向与路由别名

路由重定向

使用 redirect 定义一个重定向

路由表尾部添加

{
    path: '/:pathMatch(.*)*',
    name: 'redirect',
    redirect: to => {
    
    // to中包含重定向到目标路由的信息
        console.log(to);

        return {
        
        // 配置重定向路由的目标位置， 也可配置携带的参数
            path: '/',
            query: {
                mes: '重定向的'
            }
        }
    }
}

现在前往 c 路由

http://127.0.0.1:5173/#/c

定向后

http://127.0.0.1:5173/#/?mes=重定向的

路由别名

可以通过 alias 配置路由别名， 这样，通过不同的路由路径可以访问到同一路由

{
    path: '/',
    name: 'index',
    alias:['/root', '/index', '/home'],
    components: {
        default: () => import('@/views/home/index.vue'),
        a: () => import('@/views/a/index.vue'),
        b: () => import('@/views/b/index.vue')
    }
}

在地址栏输入对应的路由别名都可以访问到同一页面