Comment obtenir le nom actuel de l'itinéraire dans Vue?

Question

Je veux obtenir le nom de l'itinéraire actuel de vue-router, j'ai un menu de composants avec navigation vers un autre composant, donc je veux afficher le nom de l'itinéraire actuel. J'ai ceci:

created(){
    this.currentRoute;
    //this.nombreRuta = this.$route.name;
},
computed:{
    currentRoute:{
        get(){
            this.nombreRuta = this.$route.name;
        }
    }
}

Mais l'étiquette du nom de la route ne change pas, l'étiquette n'affiche que le nom de la première route chargée. Je vous remercie

MODIFIER:

Image pour montrer ce que je veux

Answer 1

Vous utilisez computed de manière incorrecte. Vous devez renvoyer la propriété dans la fonction. Voir docs pour plus d'informations.

Voici votre exemple adapté:

computed: {
    currentRouteName() {
        return this.$route.name;
    }
}

Vous pouvez ensuite l'utiliser comme ceci:

<div>{{ currentRouteName }}</div>

Vous pouvez également l'utiliser directement dans le modèle sans utiliser de propriété calculée, comme ceci:

<div>{{ $route.name }}</div>