CODEWITHSUNDEEP
javascriptarraysvue.jsvuex
TJ Weems
TJ Weems

Reputation: 1114

Can you use splice() inside forEach()? Vue Mutation

Hello so perhaps there is a better method but I want to replace the objects that match a certain index with my response data. I am currently trying to use splice() inside of a forEach(), however it does not replace the objects only removes them.

I am using Vue.js

Here is my Mutation

updateCheckedEngagements(state, checkedEngagements) {
  checkedEngagements.forEach((engagement) => {
  const index = state.engagements.findIndex((e) => e.id === engagement.id);
    state.engagements.splice(index, checkedEngagements.length, {
     'id': checkedEngagements.id,
     'client_id': checkedEngagements.client_id,
     'workflow_id': checkedEngagements.workflow_id,
     'return_type': checkedEngagements.return_type,
     'year': checkedEngagements.year,
     'assigned_to': checkedEngagements.assigned_to,
     'status': checkedEngagements.status,
     'done': false
     })
   });
  },

Upvotes: 0

Views: 994

Answers (1)

charlietfl
charlietfl

Reputation: 171690

There is no need to use splice() you can simply reassign the specific array element to a new object value.

Also there are no properties like id on the checkedEngagements array, you want the specific engagement object instance

checkedEngagements.forEach((engagement) => {
  const index = state.engagements.findIndex((e) => e.id === engagement.id);
  // TODO: make sure index isn't -1 and return if it is

  // reassign that index to new object value
  state.engagements[index] = {
    'id': engagement.id,
    'client_id': engagement.client_id,
    'workflow_id': engagement.workflow_id,
    'return_type': engagement.return_type,
    'year': engagement.year,
    'assigned_to': engagement.assigned_to,
    'status': engagement.status,
    'done': false
  }
})

An alternate way to accomplish this without manually writing out all the properties manually is use Object.assign()

checkedEngagements.forEach((engagement) => {
  const o = state.engagements.find((e) => e.id === engagement.id);
  Object.assign(o, engagement, {done:false}) 
})

Upvotes: 2

Related Questions