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.