Maison  >  Article  >  interface Web  >  Comment résoudre le problème « Erreur : navigation redondante évitée vers l'emplacement actuel » lors de l'utilisation de vue-router dans l'application Vue ?

Comment résoudre le problème « Erreur : navigation redondante évitée vers l'emplacement actuel » lors de l'utilisation de vue-router dans l'application Vue ?

PHPz
PHPzoriginal
2023-06-24 17:39:201699parcourir

Lors de l'utilisation de vue-router dans une application Vue, le message d'erreur « Erreur : navigation redondante évitée vers l'emplacement actuel » apparaît parfois. Ce message d'erreur signifie « éviter une navigation redondante vers l'emplacement actuel » et est généralement provoqué par un clic répété sur le même lien ou par l'utilisation du même chemin de routage. Alors, comment résoudre ce problème ?

  1. Utilisez le modificateur exact

Lors de la définition du lien de routeur ou de l'utilisation de la navigation programmatique, vous pouvez ajouter l'attribut exact, ce qui signifie qu'il correspond exactement à l'itinéraire. Par exemple :

<router-link to="/" exact>首页</router-link>
  1. Utilisez l'attribut replace

Dans certains cas, nous pouvons avoir besoin de laisser l'utilisateur passer d'une page à une autre sans ajouter un nouvel enregistrement à l'historique du navigateur. Vous pouvez utiliser la méthode de remplacement du routeur. Par exemple :

router.replace('/login')
  1. Utilisez la méthode beforeRouteUpdate

Si la mise à jour de l'itinéraire dans le composant ne répond pas à temps, vous pouvez utiliser la méthode beforeRouteUpdate pour mettre à jour manuellement le composant. Par exemple :

beforeRouteUpdate (to, from, next) {
  if (to.path === from.path) {
    next(false)
  } else {
    this.$forceUpdate()
    next()
  }
}
  1. Évitez les clics répétés

Un clic répété sur le même lien ou l'utilisation du même chemin de routage entraînera l'erreur « Erreur : navigation redondante évitée vers l'emplacement actuel ». Nous pouvons utiliser certaines techniques pour empêcher les utilisateurs de cliquer à plusieurs reprises, comme l'ajout d'attributs désactivés aux liens ou l'utilisation de fonctions de limitation.

Résumé :

Lors de l'utilisation de vue-router dans une application Vue, le message d'erreur « Erreur : navigation redondante évitée vers l'emplacement actuel » peut apparaître car l'itinéraire saute à plusieurs reprises ou utilise le même chemin de routage. Nous pouvons résoudre ce problème en utilisant le modificateur exact, l'attribut replace, la méthode beforeRouteUpdate ou en évitant les clics répétés.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn