Spread operator to update array of objects

Question

I have an array of objects. In that array, I want to update a single object, and in that object, I want to update only specific properties. I tried:

setRequiredFields(prevRequiredFields => ([
            ...prevRequiredFields, prevRequiredFields.find(x => x.name = field) ?  {
                isValid: isValid,
                content: content,
                isUnchanged: false
            }
]));

But it didn't work. Required fileds is an array with the following structure:

[{
    name: "Name",
    isValid: false,
    content: "",
    isUnchanged: true,
    tip: "Name cannot be empty",
    isValidCondition: notEmptyRegex,
    reportState: validateField
}]

What I'm trying to do here is to update only a isValid, content and isUnchanged of one specific object inside that array. How can I accomplish that?

Why not use .map instead then? Just do setRequiredFields(prevRequiredFields.map(item => item.name === field ? {...item, isValid, content, isUnchanged: false} : item) — Ameer
– Ameer, Commented Aug 1, 2021 at 18:43

Ammar · Accepted Answer · 2021-08-01 19:07:51Z

4

If you have an array of objects, and you want to update few properties of one of the objects inside the array. Then you could do something like this.

const index = state.findIndex(x => x.name === field);
if(index > -1) {
  const newState = [...state];
  newState[index] = { 
    ...newState[index],
    isValid: isValid,
    content: content,
    isUnchanged: false
  }
  setRequiredFields(newState);
}

Find the index of the object that you want to update.
Add properties inside that object.
Update the react state.

answered Aug 1, 2021 at 19:07

Ammar

2721 silver badge7 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Spread operator to update array of objects

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related