Maison > Article > interface Web > Exemples de redirection de route et de paramètres d'alias Vue Router
Exemple : La redirection signifie que lorsque l'utilisateur accède à /home
, l'URL sera remplacée par /
puis mise en correspondance avec /. /home
时,URL 会被 /
替换,然后匹配成 /
。
重定向也是通过 routes
配置来完成,下面例子是从 /home
重定向到 /
:
const routes = [{ path: '/home', redirect: '/' }]
重定向的目标也可以是一个命名的路由:
const routes = [{ path: '/home', redirect: { name: 'homepage' } }]
也可以是一个方法,动态返回重定向目标:
const routes = [ { // /search/screens -> /search?q=screens path: '/search/:searchText', redirect: to => { // 方法接收目标路由作为参数 // return 重定向的字符串路径/路径对象 return { path: '/search', query: { q: to.params.searchText } } }, }, { path: '/search', // ... },]
将 /
别名为 /home
,意味着当用户访问 /home
时,URL 仍然是 /home
,但会被匹配为用户正在访问 /
。
const routes = [{ path: '/', component: Homepage, alias: '/home' }]
通过别名,可以自由地将 UI 结构映射到一个任意的 URL,而不受配置的嵌套结构的限制。使别名以 / 开头,以使嵌套路径中的路径成为绝对路径。甚至可以将两者结合起来,用一个数组提供多个别名:
const routes = [ { path: '/users', component: UsersLayout, children: [ // 为这 3 个 URL 呈现 UserList // - /users // - /users/list // - /people { path: '', component: UserList, alias: ['/people', 'list'] }, ], },]
/people
是绝对路径的写法,即可以直接通过 /people
来访问。list
routes
. L'exemple suivant redirige de /home
vers /
:
const routes = [ { path: '/users/:id', component: UsersByIdLayout, children: [ // 为这 3 个 URL 呈现 UserDetails // - /users/24 // - /users/24/profile // - /24 { path: 'profile', component: UserDetails, alias: ['/:id', ''] }, ], },]Cible redirigée Cela peut également être une route nommée : rrreee Il peut aussi s'agir d'une méthode qui renvoie dynamiquement la cible de la redirection :
rrreeeAlias
Alias /
vers /home
, cela signifie que lorsqu'un utilisateur accède à /home
, l'URL est toujours /home
, mais sera mise en correspondance comme si l'utilisateur accédait à /
. rrreeeAvec les alias, vous pouvez librement mapper la structure de l'interface utilisateur à une 🎜URL arbitraire🎜, et 🎜n'est pas limité par la structure imbriquée configurée🎜. Faites commencer l'alias par / pour que le chemin à l'intérieur du chemin imbriqué devienne un 🎜chemin absolu🎜. Vous pouvez même combiner les deux, 🎜Utilisez un tableau pour fournir plusieurs alias🎜 : 🎜rrreee🎜/people
est un chemin absolu, c'est-à-dire que vous pouvez directement transmettre /people
accéder. list
est un chemin relatif, c'est-à-dire que l'URL sera associée au chemin du parent → /users/list. 🎜🎜🎜Remarque🎜 : Si l'itinéraire a des paramètres, assurez-vous de les inclure dans tous les alias absolus : 🎜rrreee🎜【Recommandation associée : 🎜tutoriel vidéo vue.js🎜】🎜🎜🎜Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!