[Vuejs]-Vuex state change on object does not trigger rerender

by

2👍

✅

Since the getter only returns state variable you should use mapState, if you want to access it directly.

computed: mapState(['permissions'])

However, you can also use mapGetters, but then in your template, have to use getPermissions and not permissions.
Example template:

<ul id="permissions">
  <li v-for="permission in getPermissions">
    {{ permission }}
  </li>
</ul>

If you have done this it is probably an issue with the object reference. You use Vue.set, but you set the same object reference. You have to create a new object or set the key you want to update directly.

new object

let newList = { ...state.permissions };

Vue.set

Vue.set(state.permission, data.key, data.value);

0👍

I don’t know what the rest of you code looks like, but you will need to use actions to correctly mutate you store.

For example:

const actions = {
  setName({ commit }, name) {
    commit('setName', name);
  },
}

Leave a comment