vue2 router-link before redirect

Question

I am using Vue2. In Crude List showing all the items and want to redirect to another page in click action edit button

I using

<router-link :to="{ name: 'beneficiary_form'}"><i class="fas fa-edit"></i> Edit</router-link>

This is an update function I need to pass the id in the link.

Using vuex to save the beneficiary_id.

this.add({
         beneficiary_id        : data.id,                    
});

How can I add the beneficiary_id before redirect to beneficiary_form page?

I changed the code like

<a  href="javascript:void(0)" @click="handleEdit(beneficiary.id)"><i class="fas fa-edit"></i> Edit</a>

 handleEdit(id){
            this.add({
                beneficiary_id        : id,
            });
            console.log(this.$route.name);
            history.pushState(
                    {},
                    null,
                    route('beneficiary_form')
                );
        },

this is giving error route('beneficiary_form') not found

Answer 1

If you use VueRouter and have configured it correctly, you can use

router.push({ name: 'beneficiary_form' });

Then in the form page you can get the beneficiary_id from vuex.

See Vue router Programmatic Navigation DOCS