Vue.js, pass data to component on another route

user_5272053 0
Viewed 19771

Simple task to pass data from one page to another made a real headache to newbie in Vue.js Here is my router enter image description here

I'm rendering a form on "/" page, which make an API request, enter image description here

and I just want to pass data to another route page with another component enter image description here

Is it so hard to do in Vue? It made a real headache for me today. Get data from API, save & send to another component. How can I do it?

vue-router vuejs2 vue.js rest javascript
4 Answers

Try using Vuex

In Source Component

this.$store.commit('changeDataState', this.$data);
this.$router.push({name: 'user-post-create'});

In Destination Component

created () {
    console.log('state', this.$store);
    this.$store.getters.Data;
}
Admin1

Add props true in your vue router


{
    path: "/pay-now",
    name: "pay",
    props: true,
    component: () =>
      import(/* webpackChunkName: "about" */ "../components/account/pay.vue"),
    beforeEnter: AuthGuard,
  },

After that pass props with router like that

        this.$router.push({ 
        name: "pay",
        params: {
        result:this.result,
      }
      });
user_125766820
Related