javascript - Pass Vue query parameter from current route to router-link - Stack Overflow

admin管理员组

文章数量:1333481

I know this cannot be this difficult, all I want to do is detect the query parameter and pass it to my ponent. What do I have to do to access router from a ponent in Vue?

<router-link :to="{ path: '/', query: { myQuery: /*query parameter here/* } }" >Go There</router-link>

No matter what I do I can't figure it out. I've tried everything I can find online, and for some reason in Vue "this" doesn't exist, and I'm literally ready to give up and go back to Angular.

Seriously, I can't even access it inside the tag, and importing the actual router from the routing file does nothing.

How do I make this happen? I feel like it shouldn't be this plicated just to get query parameters from the url in ANY framework. I've been reading manuals all day, can somebody please just help me out here?

I know this cannot be this difficult, all I want to do is detect the query parameter and pass it to my ponent. What do I have to do to access router from a ponent in Vue?

<router-link :to="{ path: '/', query: { myQuery: /*query parameter here/* } }" >Go There</router-link>

No matter what I do I can't figure it out. I've tried everything I can find online, and for some reason in Vue "this" doesn't exist, and I'm literally ready to give up and go back to Angular.

Seriously, I can't even access it inside the tag, and importing the actual router from the routing file does nothing.

How do I make this happen? I feel like it shouldn't be this plicated just to get query parameters from the url in ANY framework. I've been reading manuals all day, can somebody please just help me out here?

• javascript
• vue.js
• object
• vue-ponent
• vue-router

Share Improve this question Follow edited Jan 14, 2021 at 5:08 Dan 63.2k1818 gold badges110110 silver badges119119 bronze badges asked Jan 14, 2021 at 4:01 StephenRiosStephenRios 2,24266 gold badges2727 silver badges4646 bronze badges 2

• When you say "detect", you mean from the current route? And when you say "pass it", you mean to the <router-link>. So, to be clear, you would like to pass the same query from the current route into the link for another route? – Dan Commented Jan 14, 2021 at 4:27
• @Dan 100% on the nose, yes – StephenRios Commented Jan 14, 2021 at 4:33

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 8

The current route's query is in this.$route.query and you can pass that entire query object on to another route if you want to preserve it in the destination:

<router-link
  :to="{ path: '/', query: $route.query }"
>
  Go There
</router-link>

If you only want to pass a specific query param:

<router-link
  :to="{ path: '/', query: { myQuery: $route.query.myQuery }}"
>
  Go There
</router-link>

本文标签： javascriptPass Vue query parameter from current route to routerlinkStack Overflow