How to get route by name and parameters with Vue Router?

Sometimes, we want to get route by name and parameters with Vue Router.

In this article, we’ll look at how to get route by name and parameters with Vue Router.

How to get route by name and parameters with Vue Router?

To get route by name and parameters with Vue Router, we can use the this.$router.resolve method.

For instance, we write

const props = this.$router.resolve({
  name: "ProductDetail",
  params: { id, slug },
});
console.log(props.href);

to call this.$router.resolve with an object that has the route name and the query string params key-value pairs in it.

Then we get the resolved URL string from the props.href property.

Conclusion

To get route by name and parameters with Vue Router, we can use the this.$router.resolve method.