Exemple de tutoriel résumant les problèmes de saut de routage Vue

Cet article présente principalement l'explication détaillée de l'enregistrement du problème de saut Vueroutage L'éditeur pense que c'est assez bon, je vais donc le partager avec vous maintenant et le donner en guise de document. référence. Suivons l'éditeur et jetons un coup d'œil

Récemment, j'ai besoin d'utiliser Vue pour créer une application dans mon projet. J'ai rencontré les problèmes suivants lors de l'utilisation du routage dans Vue.

Les paramètres de routage sont les suivants :

{

path:'/tab',

component:Tab,

children:[{

path:'layoutList',

name:'LayoutList',

component:LayoutList

},{

path:'layoutView/:layoutId',

name:'LayoutView',

component:LayoutView

},{

path:'layoutDetail/:viewId',

name:'LayoutDetail',

component:LayoutDetail

}]

}

où /tab est l'adresse racine, avec 3 sous-adresses, et les 3 niveaux de sous-adresses sont : LayoutList => => LayoutDetail

Situation normale : supposons que l'itinéraire actuel est /tab/layoutList et que vous devez accéder à la page LayoutView. Vous pouvez utiliser router.push({path:'layoutView/'+item. id})

après le saut. L'itinéraire est /tab/layoutView/1

Quand je veux. passer de la page LayoutView à la page LayoutDetail correspondante :

Situation 1 : (Page introuvable)

Adresse avant le saut : /tab/layoutView/1

Code de saut : router.push({ path:'layoutDetail/'+item.id});

Adresse après le saut :/tab/layoutView/layoutDetail/27

Cas 2 : (Page non trouvée)

Adresse avant le saut : /tab/layoutView/1

Code de saut : router.push({path:'/layoutDetail/'+ item.id});

Adresse après le saut :/layoutDetail/27

Cas 3 : (Page non trouvée)

Adresse avant le saut : /tab/layoutView /1

Code de saut : router.push({path:'tab/layoutDetail/'+item.id});

Adresse après le saut :/tab/layoutView/ tab/ layoutDetail/27

Cas 4 : (La page s'affiche normalement)

Adresse avant le saut : /tab/layoutView/1

Jump code : router.push({path:'/tab/layoutDetail/'+item.id});

Adresse après le saut :/tab/layoutDetail/27

Suivez uniquement l'opération dans cas 4, afin que la page puisse s'afficher normalement.

Le routage Vue sera basé sur l'adresse du push Si l'adresse ne commence pas par /, il remplacera directement l'adresse après le dernier / de l'itinéraire en cours

Si l'adresse. commence par /, il utilisera l'adresse de push comme adresse absolue.

De plus, j'ai essayé d'utiliser router.go({name:'LayoutDetail',params:{viewId:item.id}}), la page ne sautera pas et l'adresse ne changera pas.

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!