Vue Router Get Query Params Code Example

Example 1: query params vuejs

http://localhost:8000?name=John&email=john@gmail.com   parameters = this.$route.query  console.log(parameters)   name = this.$route.query.name  console.log(name)

Example 2: url params vue

//we can configure the routes to receive data via the url //first configure the route so it can receive data:  const routes=[ . . {path : '/page/:id?', name='page', component: Page}, . .  //inside the Page component we can get the data:    name:'Page',   mounted(){      this.url_data=this.$route.params.id;     },   data(){    return{      url_data: null     };   }         //the data can be then used in the template section of the component   <h2> {{url_data}}</h2>

Example 3: get params from route vuejs

const User = {   template: '<div>User {{ $route.params.id }}</div>' }

Example 4: vue router url string

const resolved = this.$router.resolve({   name: 'SomeRouteName',   params: { id: item.id } }) resolved.href // '/some-route-name/:id'