[Vuejs]-Conditionally show div on $route path change not working

by

2👍

✅

Update:

A better answer as Maavia suggested should look like this:

Add a computed property

computed: {
isHome() {
    return this.$route.path == "/" ||  this.$route.path == "/home";
   }
}

Then Check for its value in the template:

    <p v-if='isHome'>
       <router-link to="/">projects</router-link> /
       <router-link to="/experiments">experiments</router-link>
    </p>

Check out the if statement.

watch: {
     $route(to, from) {
        if (this.$route.path == "/" || this.$route.path == "/home" ) {
           this.home = true
        } else {
           this.home = false
        }
     }
  },
👤FMa

1👍

you need to write a compute method for that and place check on compute method

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

you can simply check on div

👤M Maavia

Leave a comment