Categories
Vue Answers

How to fix Vue Router this.$router.push not working on methods with Vue.js?

Spread the love

Sometimes, we want to fix Vue Router this.$router.push not working on methods with Vue.js.

In this article, we’ll look at how to fix Vue Router this.$router.push not working on methods with Vue.js.

How to fix Vue Router this.$router.push not working on methods with Vue.js?

To fix Vue Router this.$router.push not working on methods with Vue.js, we should call it with the name or path of the route.

For instance, we write

<script>
//...
export default {
  //...
  methods: {
    pushName() {
      this.$router.push({ name: "Home" });
    },
    pushPath() {
      this.$router.push({ path: "/" });
    },
  },
  //...
};
</script>

to call this.$router.push with an object that has the name set to the name property value of a path that we set when we defined the routes in the pushName method

In pushPath, we call push with an object with the path set to the URL path of the route we want to go to.

Conclusion

To fix Vue Router this.$router.push not working on methods with Vue.js, we should call it with the name or path of the route.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *