Vuejs: événement sur le changement de route

Dans ma page principale, j'ai des listes déroulantes qui montrent v-show=show en cliquant sur le lien ci - @click = "show=!show" et show=false quand je change de route. Conseillez-moi s'il vous plaît comment réaliser cette chose.

26
demandé sur kipris 2017-09-25 13:17:50

2 réponses

Installation d'un watcher sur $route dans votre composant comme ceci:

watch:{
    $route (to, from){
        this.show = false;
    }
}

Ceci observe pour les changements d'itinéraire et lorsqu'ils sont modifiés, définit show à false

57
répondu Vamsi Krishna 2018-03-16 12:24:22

Si vous utilisez v2.2.0, une autre option est disponible pour détecter les changements dans $routes.

Pour réagir aux changements de paramètres dans le même composant, vous pouvez simplement regarder l'objet $ route: 

const User = {
  template: '...',
  watch: {
    '$route' (to, from) {
      // react to route changes...
    }
  }
}

Ou, utilisez la garde beforeRouteUpdate introduite en 2.2: 

const User = {
  template: '...',
  beforeRouteUpdate (to, from, next) {
    // react to route changes...
    // don't forget to call next()
  }
}

Référence: https://router.vuejs.org/en/essentials/dynamic-matching.html

6
répondu Shubham Nigam 2018-02-21 05:29:54