Home

I was trying to use $router.push() to navigate to a different page on clicking NEXT Button on the first page.

When I am clicking Next button, it is navigating to next page and immediately reloading the first Page.

1 ) step1. vue

<button type="submit" @click="updateCurrentPageIndex(), gotoNextPage()">Next</button>

     gotoNextPage() {
             this.$router.push(this.$store.state.pages[this.$store.getters.currentPageIndex]);
      },
   updateCurrentPageIndex() {
             this.$store.commit('updateCurrentPageIndex');
     }

2. store/index.js

 ```

import Vuex from ‘vuex’;

 const store = ()  =>  {
  return new Vuex.Store({
state: {
    pages:['step1','step2','step3','summary'],
    currentPageIndex:0
 },
 getters: {
    currentPageIndex(state) {
        return state.currentPageIndex;
    }
},
 mutations: {
    updateCurrentPageIndex(state) {
        state.currentPageIndex++;
    }
}

    
    
      


<!--cmty--><!--cmty_prevent_hook-->
<div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c6839">#c6839</a>)</em></sub></div>