[Vuejs]-$router.push refreshing the page and losing data

0πŸ‘

βœ…

I got it working, in my case I could just do it on a button press which was my use case anyway. b-button is VueBootstrap. I did change the name to a simple string.

<b-button
  class="cardButton"
  variant="secondary"
  //This is where the magic happens
  to="{ name: 'newTrade', params: {trade} }"
> Edit </b-button>

In the component

created () {
        if (this.$route.params.trade){
          //You can use $route.params.trade to access trade.
          this.model = this.$route.params.trade;
        }

0πŸ‘

Referencing to route by its name will only work when the route is named. Make sure the route you’re referencing has name parameter in routes definition in the Vue Router object.

You can also programmatically navigate to a route by using its path instead of name. In your case it would look like this:

this.$router.push({ path: `/trading/newTrade/${tradeData}` })

Documentation reference

Leave a comment