CODEWITHSUNDEEP
javascriptvue.jsvuex
Ramitha Rupasinghe
Ramitha Rupasinghe

Reputation: 203

Vuex state not updating after mutation

I'm trying to set some values to the state using a mutation in my Vue/Vuex application.

component.vue

created() {
    let clubId = {'clubId': 31};
    this.$store.dispatch(
    "clubConfiguration/getClub",
    clubId 
  );
}

action.js

getClub(context, payload) {
    ApiService().post('/club/getSingleClub', {
        "ClubId": payload.clubId
    })
     .then(res => {
          context.commit('GET_CLUB_INFORMATION', res.data.data[0]);
     })
     .catch(err => {
           console.log(err)
    })
}

mutation.js

GET_CLUB_INFORMATION(state, payload) {
    state.Name = payload.Name
    console.log(state);
}

state.js

Name: '',
mapLocation: { lat: 39.585693, lng: 2.622868, zoom: 18 },
courts: [
    {
        id: 0,
        number: 1,
        name: 'Court 1',
        map: null
    }
]

Now, in the console.log i have in the mutation shows that 'Name' in the payload have attached to the state along with other state properties. But when i am checking in the Vue dev tools or tried to access the state.Name from the component it shows the state.Name property in the state as undefined. What did I do wrong?

Upvotes: 0

Views: 162

Answers (1)

Sdpotts93
Sdpotts93

Reputation: 144

Found it! Your mutation should be

 GET_CLUB_INFORMATION(state, payload) {
  state.Name = payload
  console.log(state);
 }

cause you are passing just the name, not the whole payload

Upvotes: 1

Related Questions