千锋教育前端Vue3.0全套视频教程(Kerwin2023版,Vue.js零基础

路由重定向允许你在访问某个路径时自动将用户重定向到另一个路径。这在需要将旧URL导向到新URL或者提供URL的简化版本时非常有用。
路由别名则是指给路由规则设置一个额外的名称,当使用别名导航时,URL路径将会匹配到指定的路由规则,但实际上URL路径将保持原样,用户在浏览器地址栏中看到的是原始的URL。
1. 路由重定向:
在Vue Router中,你可以通过在routes
数组中使用redirect
字段来创建重定向规则。
import { createRouter, createWebHistory } from 'vue-router';
const routes = [
{ path: '/', redirect: '/home' }, // 将根路径重定向到'/home'
{ path: '/old', redirect: '/new' }, // 将'/old'重定向到'/new'
// 其他路由规则...
];
const router = createRouter({
history: createWebHistory(),
routes,
});
export default router;
2. 路由别名:
在Vue Router中,你可以通过在routes
数组中使用alias
字段来创建路由别名。
import { createRouter, createWebHistory } from 'vue-router';
const routes = [
{ path: '/home', component: Home }, // 实际的路由规则
{ path: '/start', component: Home, alias: '/home' }, // '/start'被视为'/home'的别名
// 其他路由规则...
];
const router = createRouter({
history: createWebHistory(),
routes,
});
export default router;