[Vuejs]-How can I convert query from a URL in Vue.js to string?

by

3👍

✅

You can pipe plain, single-level objects through URLSearchParams to form correctly encoded query strings.

For example

// just an example to match your Vue code
this.$route = {
  query: { next: "/api/o/authorize/?client_id=xxx", nonce: "bee", redirect_uri: "http://X.app.net/oauth/providers/appZ/callback", response_type: "code", scope: "read", state: "123" }
}

const { next, ...params } = this.$route.query
const url = `${next}&${new URLSearchParams(params)}`

console.log(url)
👤Phil

1👍

Define a computed property called query :

computed:{
  query(){
    let q=this.$route.query;
      return Object.keys(q).map(k=>`${k}=${q[k]}`).join('&').replace("next=","")
  }
}

example in js :

let q={ next: "/api/o/authorize/?client_id=xxx", nonce: "bee", redirect_uri: "http://X.app.net/oauth/providers/appZ/callback", response_type: "code", scope: "read", state: "123" }

let query=Object.keys(q).map(k=>`${k}=${q[k]}`).join('&').replace("next=","")

console.log(query)
👤Boussadjra Brahim

Leave a comment