0

From my main vue instance I am trying to detect when a route is changed. So far what i have learned that i need to deep watch an object to detect property changes. But my approach is not working. What am i doing wrong:

const app1 = new Vue({
  el: '#app1',
  router,
  data: {
    activeRoute: router.currentRoute
 },

 methods: {
    printclass: function() {
        console.log(router.currentRoute.path);
    }
 },

 computed: {
 },

 watch: {
    'router.currentRoute': {
        handler(newVal) {
            console.log('changed');
        }, deep: true
    }
 },

 created: function() {
    console.log(router.currentRoute);
 }
});

I know that the currentRoute object's path property changes when the route changes(i.e; a different component is rendered).

Yeasir Arafat Majumder
  • 1,222
  • 2
  • 15
  • 34
  • 1
    Possible duplicate of [call a function every time a route is updated vue.js](https://stackoverflow.com/questions/45602622/call-a-function-every-time-a-route-is-updated-vue-js) – Phil May 21 '19 at 05:50
  • @Phil While the answer to that post is what i was looking for, my question directly mentions about watching route object and more likely to draw more users.Thanks for pointing to the other post though. I got what i needed – Yeasir Arafat Majumder May 21 '19 at 06:04

1 Answers1

0

Watch the $route. 

watch: {
     '$route' (to, from) {
        this.yourFunction(           
    },
For the Name
  • 2,459
  • 18
  • 17