Update react State array of nested objects

November 10, 2021

Maybe this is stupid but my state is an array of nested objects 😮
It looks as follows:

  const data = [
        {
            randomid1: {
                name: 'lorem',
                latinName: 'ipsem',
            },
        },
        {
            randomid2: {
                name: 'lorem2',
                latinName: 'ipsem2',
            },
        },
    ]

I need to update this array with a new name and/or latinName for one of the items (let’s say randomid1.name .

I have been struggling with spreading etc but keep getting errors. Now im trying mapping over something but this too won’t work. Anyone?

>Solution :

You can check if the array contains a certain item using Array#find and Object#hasOwnProperty:

const 
  data = [
    { randomid1: { name: 'lorem', latinName: 'ipsem' } },
    { randomid2: { name: 'lorem2', latinName: 'ipsem2' } }
  ],
  id = 'randomid2';

const elem = data.find(e => e.hasOwnProperty(id));
if(elem) {
  elem[id].name = 'new name';
}

console.log(data);