2

I am currently trying to pass an array thats accessible on one page to the next. The next page is accessed on a forms submission using this.$router.push('path')

Is there any way for me to pass the array over as well when submitting the form so that I can access it on the new page?

kissu
  • 40,416
  • 14
  • 65
  • 133
blue4euro4
  • 43
  • 4
  • Duplicate of https://stackoverflow.com/questions/45151810/passing-props-with-programmatic-navigation-vue-js – eyecatchUp Sep 07 '21 at 08:50

2 Answers2

2

You can't do that with Vue router directly as explained in this answer, you can only pass String type.

If you want to access it on another page, you can either:

  • store it in cookies or localStorage (not recommended)
  • fetch it from the submission: the backend probably gives you a response
  • use Vuex or even some state that can overlap between the current and next page
kissu
  • 40,416
  • 14
  • 65
  • 133
  • Is there anyway to pass a string but not have it visible in the URL? – blue4euro4 Sep 07 '21 at 09:04
  • All of the 3 methods above do not use the URL (the state is invisible for the end user). If you `POST` something, you can send a body yeah, but this is unrelated to what you're trying to achieve here. I mean, it is somehow related to my 2nd solution but still not directly what you're asking for here. @blue4euro4 – kissu Sep 07 '21 at 09:17
0

If you don't wanna use vuex or other store managers then the simplest way could be doing

this.$router.push('path').then(() => { this.$route.params.yourArray = ['value'] })

and then in the destination component use that same

this.$route.params.yourArray
Sona Rijesh
  • 1,041
  • 7
  • 32
  • 62
Ryrayer
  • 1