Search code examples
vuejs2nuxt.jsvuex

NUXT Vuex change state value returns store state error

I'm trying to modify a state then push it back to store but it returns me an error

methods : {
  modalBtnClick(index){
    let btns = [];

    this.$store.state.utility.modal_content.btns.forEach((item)=>{
      btns.push(item);
    });

    btns[index].result = true;

    this.$store.commit('utility/modal_content',{
      body : this.$store.state.utility.modal_content.body,
      btns : btns
    });
  }
}

Error: [vuex] do not mutate vuex store state outside mutation handlers.

Any help, ideas is greatly appreaciated.

Solution

  • I just did json stringify and then parse back and seems working now

    let data = JSON.parse( JSON.stringify( this.$store.state.utility.modal_content ) );

data.btn[index].result = true;

this.$store.commit('utility/modal_content',data');