1 year ago

#383659

test-img

pancake

Vuex Mutation is already set with the new payload before the function is run

setScorecardActiveVerificationsList(state, payload) {
    console.log(
      'beginState :>> ',
      state.activeScorecardVerificationsList
    )
    const findIndex = state.activeScorecardVerificationsList.findIndex(
      (el) => el.part_id === payload.part_id
    )
    console.log('findIndex', findIndex)
    if (findIndex !== -1) {
      const newArray = state.activeScorecardVerificationsList.filter(
        (el) => el.part_id !== payload.part_id
      )
      newArray.push(payload)
      state.activeScorecardVerificationsList = newArray
      console.log(
        'FoundstateactiveScorecardVerificationsList',
        state.activeScorecardVerificationsList
      )
    } else {
      state.activeScorecardVerificationsList = [
        ...state.activeScorecardVerificationsList,
        payload,
      ]
      console.log(
        'NotFoundactiveScorecardVerificationsList',
        state.activeScorecardVerificationsList
      )
    }
  },

I'm still a bit new to Vuex but I'm having trouble with this mutation. This mutation format I've used on two other parts of the code that are working fine so this one is stumping me.

Btw, state.activeScorecardVerificationsList is an array of Objects.

I'm checking to see if the payload with part_id is already existing in the state. IF it exists, I want to overwrite it and return the state with the newly updated object in the array. IF this payload with the part_id does not exist, I just want to add it to the array.

Currently I'm having trouble with this part of the code:

console.log(
      'beginState :>> ',
      state.activeScorecardVerificationsList
    )
    const findIndex = state.activeScorecardVerificationsList.findIndex(
      (el) => el.part_id === payload.part_id
    )

For some reason, the beginState console log is showing the state with the payload.part_id (new one) almost immediately before any of the other lines of function is run. therefore, findIndex is returning 0 and it is always overwriting the state, not adding to it.

I'm not entirely sure how the state is already being sent with the new payload. I have a feeling my syntax or understanding of setting a vuex mutation might be off

Any ideas?

vue.js

nuxt.js

vuex

0 Answers

Your Answer

Accepted video resources