VueJS: How to use routing in an Multi Page App to send url query params?

Question

I'm a bit new to VueJS, I am using the MPA approach in VueJS to create an App with multiple pages (using this answer) and I want to have a query parameter in the url that navigates to the signup page from the pricing page like "localhost:8080/signup?bundle=standard"

this is my pages structure:

(image)

I used vue router and router link to do this, but I don't know where to put the router view as in the docs they only use it in a single page application.

How can I achieve this? How can I get the query params in a MPA app structure?

Could you please some code or what you have done so far?

oftedal
– oftedal

2019-10-31 10:52:06 +00:00
Commented Oct 31, 2019 at 10:52 — oftedal
– oftedal, Commented Oct 31, 2019 at 10:52

Khem Raj Regmi · Accepted Answer · 2019-10-31 10:54:16Z

1

There are couple of ways for the redirection with parameter in vue.js you can simply make redirection from any method as follows:

setTimeout(() => {
              return  this.$router.push({name: 'Your_Router_Name_Hear', params: { bundle: 'standard' }})
            }, 100);

Another way is redirection from your template with parameters:

<router-link:to="{ name: 'Your_Router_Name_Hear', params: { bundle: 'standard' }}" class="button" > <i class="fa fa-edit"></i> Edit </router-link>

answered Oct 31, 2019 at 10:54

Khem Raj Regmi

2,29022 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

VueJS: How to use routing in an Multi Page App to send url query params?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related