Spread operator to update array of objects

user_8286276 0
Viewed 1283

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?

typescript reactjs javascript
1 Answers

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.
user_164010560
Related