Trying to update an array in an object inside of an object. React, useState

Question

I have an onChange method that looks like this:

const onChangeEnableWhenValueCalculation = i => (event) =>{
      setItem({
        ...newItem,
        enableWhen: [
          {
           linkId: newItem.enableWhen[i]?.linkId,
           operator: newItem.enableWhen[i]?.operator,
           valueCalculation: event.target.value,
          }
        ],
      });
  }

I want to change valueCalculation with event.target.value but at the specified index inside of the enableWhen.

How to I set the value of this key at specific index inside an object, inside and array, inside another object? Any help is appreciated.

Answer 1

If I understand correctly, I would do:

let enableWhen = [...newItem.enableWhen];
// replace the element at index i with the updated item
enableWhen.splice(i, 1, {
       linkId: newItem.enableWhen[i]?.linkId,
       operator: newItem.enableWhen[i]?.operator,
       valueCalculation: event.target.value,
});

setItem({
    ...newItem,
    enableWhen
});