How can I get query parameters from a URL in Vue.js?

javascript vue.js vue-router url-parameters
Rob picture Rob · Mar 10, 2016 · Viewed 269.7k times · Source

How can I fetch query parameters in Vue.js?

E.g. http://somesite.com?test=yay.

Can’t find a way to fetch or do I need to use pure JS or some library for this?

Answer

Yerko Palma picture Yerko Palma · Mar 10, 2016

According to the docs of route object, you have access to a $route object from your components, which exposes what you need. In this case

//from your component
console.log(this.$route.query.test) // outputs 'yay'

Related questions

How to add external JS scripts to VueJS Components

I've to use two external scripts for the payment gateways. Right now both are put in the index.html file. However, I don't want to load these files at the beginning itself. The payment gateway is needed only in when …

Read More
How to set URL query params in Vue with Vue-Router

I am trying to set query params with Vue-router when changing input fields, I don't want to navigate to some other page but just want to modify url query params on the same page, I am doing like this: this.$…

Read More
Can vue-router open a link in a new tab?

I have a summary page and a detail subpage. All of the routes are implemented with vue-router (v 0.7.x) using programmatic navigation like this: this.$router.go({ path: "/link/to/page" }) However, when I route from the summary page to …

Read More