三、Vue Router 重定向&别名

路由重定向

通过routes 配置来完成,从/a重定向到/b;一般用于路由匹配错误时,重定向到404页面或首页。

<script>
    // 注意,导航守卫(路由钩子函数)并没有应用在跳转路由上。
    const router = new VueRouter({
        routes: [
            { path: '/a', redirect: '/b' }, // 重定向到 /b 
            // 重定向到命名的路由
            { path: '/login', redirect: { name: 'register' }},
            // 动态返回重定向目标
            { path: '/a', redirect: to => {
                // 方法接收 目标路由作为参数
                return '/b'; // 可以是一个字符串,也可以是一个对象
            }}
        ] 
    });
</script>

别名

别名:可以理解为一个人的艺名或小名,只是换了个叫法。/a 的別名是 /b,意味着,当前访问/b时,URL会保持为/b, 但路由匹配规则为/a,就像访问/a一样。别名的功能让你可以自由的将UI结构映射到任意的URL,而不是受限于匹配的嵌套路由结构。

const router = new VueRouter({
    routes: [
        // 把/b 作为 /a的别名,都会渲染 A 模版
        { path: '/a', component: A, alias: '/b' }
    ] 
});
posted @ 2019-12-01 19:31  yuxi2018  阅读(383)  评论(0编辑  收藏  举报