千鋒教育前端Vue3.0全套視頻教程(Kerwin2023版,Vue.js零基礎(chǔ)

路由重定向允許你在訪問某個路徑時自動將用戶重定向到另一個路徑。這在需要將舊URL導(dǎo)向到新URL或者提供URL的簡化版本時非常有用。
路由別名則是指給路由規(guī)則設(shè)置一個額外的名稱,當使用別名導(dǎo)航時,URL路徑將會匹配到指定的路由規(guī)則,但實際上URL路徑將保持原樣,用戶在瀏覽器地址欄中看到的是原始的URL。
1. 路由重定向:
在Vue Router中,你可以通過在routes
數(shù)組中使用redirect
字段來創(chuàng)建重定向規(guī)則。
import { createRouter, createWebHistory } from 'vue-router';
const routes = [
?{ path: '/', redirect: '/home' }, // 將根路徑重定向到'/home'
?{ path: '/old', redirect: '/new' }, // 將'/old'重定向到'/new'
?// 其他路由規(guī)則...
];
const router = createRouter({
?history: createWebHistory(),
?routes,
});
export default router;
2. 路由別名:
在Vue Router中,你可以通過在routes
數(shù)組中使用alias
字段來創(chuàng)建路由別名。
import { createRouter, createWebHistory } from 'vue-router';
const routes = [
?{ path: '/home', component: Home }, // 實際的路由規(guī)則
?{ path: '/start', component: Home, alias: '/home' }, // '/start'被視為'/home'的別名
?// 其他路由規(guī)則...
];
const router = createRouter({
?history: createWebHistory(),
?routes,
});
export default router;