historique de vue.js et mode hachage sur un sous-chemin

Par Maximilian Batz | 2020-02-24

Si vous montez votre Vue Router non pas sur la page racine, mais sur un "sous-chemin", il existe une différence importante dans le comportement de Vue Router en mode historique et en mode hachage.

Mode historique

Si vous voulez, par exemple, utiliser https://picockpit.local/debug/ pour que le routeur Vue continue à vivre, dans mode historique:

Les routes suivantes

{chemin : '/', composant : DebugOne},

{chemin : '/two', composant : DebugTwo},

{chemin : '*', composant : FourOhFour}

ne fonctionnera pas comme prévu ! (Votre page 404 utilisant le catch all sera affichée).

Vous devrez les modifier pour inclure le sous-chemin (débogage) :

{chemin : '/debug/', composant : DebugOne},

{chemin : '/debug/two', composant : DebugTwo},

{chemin : '*', composant : FourOhFour}

Dans ce cas, vous pourrez accéder aux URLs suivants :

Mode hachage

En mode hachage, c'est exactement le contraire. Vous devrez utiliser les routes comme suit :

{chemin : '/', composant : DebugOne},

{chemin : '/two', composant : DebugTwo},

{chemin : '*', composant : FourOhFour}

Dans ce cas, vous pourrez accéder aux URLs suivants :

Publié dans Vue.js et balisé , , , , ,