Search code examples
vue.jsnuxt.jsvuexspread

Spead operator does'nt work on vuex mutations


i cant use spread operators in vuex mutation on nuxt.

mutation:

EDIT_BALLOON(state, data) {
const index = state.list.findIndex(item => item._id === data._id);
    //state.list[index] = {...data} // not works
    Object.assign(state.list[index], data); **// works**
  },

Action:

async editBalloon( store, form ){ 
    const { data } = await this.$axios.post('balloon-service/balloon/edit', form );
    store.commit('EDIT_BALLOON', data);
  }

weirdly importing vuex helpers works like { ...mapState, ...mapMutations }

Any solutions? Thanks in advance


Solution

  • Oh, I understand a bit better the issue here, this is actually a caveat of Vue2 (and essentially JS itself) that you can find more info here: https://v2.vuejs.org/v2/guide/reactivity.html#For-Objects

    You can actually use this.$set(state.list, data, index) rather than Object.assign(state.list[index], data) but it actually achieves the same result.