Question

121

Pass custom data to `$router.push()` in vue-router

rated 0 times [ 126] [ 5] / answers: 1 / hits: 32562 / 6 Years ago, thu, october 4, 2018, 12:00:00

Is there a way to pass additional data to $router.push() that is not registered as param or query in the route's path. This will allow me to recognize on the next page that it has been accessed via programmatic navigation as there is no way to pass it via URL. Something like:

this.$router.push({

   path: '/next-page', 

   params: {...}, 

   query: {...}, 

   moreData: {foo: 1}

})

And then in /next-page:

this.$route.moreData.foo // 1

Currently I am using the $store to handle moreData

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

jovanymarshalld

Add To Favorites

Follow

Total Points: 676

Total Questions: 94

Total Answers: 81

Location: Thailand

Member since Thu, Apr 22, 2021

3 Years ago

answered 6 Years ago jeniferjaliyahf · Accepted Answer

I found the solution. There is a Note in the Vue-router docs that says:

Note: params are ignored if a path is provided ... Instead, you need to provide the name

So we are allowed to pass custom data to params if we navigate using route's name like so:

$router.push({name: 'next-page', params: {foo: 1}})



// in /next-page

$route.params.foo // 1