React js adding array in a useState object property

Question

I'm pretty new to this, how do I add all of my array in the children property? You can kind of guess what I'm trying to do here, but this only gets the last array, not adding every time it loops.

for (let i = 0; i < res.data().productioncompaniesowned.length; i++) {
  setData({
    id: "root",
    name: "Production Company Owned",
    children: [{ id: i, name: res.data().productioncompaniesowned[i] }]
  });
  console.log(i);
  console.log(userData.Productioncompany[i]);
}

You are overwriting data every time (sort of, setData is an async function so effectively only the last update will be visible). You want to make the whole children list, then set it once. You can accomplish this without mutation: setData({ children: res.data().owned.map((e, i) => ({id: i, name: e })) }) — windowsill
– windowsill, Commented Dec 2, 2021 at 7:42

Stoobish · Accepted Answer · 2021-12-02 07:40:36Z

1

Set a separate array for children that adds your object, like so:

var children = [];
for (let i = 0; i < res.data().productioncompaniesowned.length; i++) {
  children.push({ id: i, name: res.data().productioncompaniesowned[i] })
}
setData({
   id: "root",
   name: "Production Company Owned",
   children: children;
});

answered Dec 2, 2021 at 7:40

Stoobish

1,3927 silver badges25 bronze badges

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

1 Comment

Stoobish Over a year ago

@MarcShayne you should be accepting the answer that was first posted if it's a duplicate answer.

Nhut Pham · Accepted Answer · 2021-12-02 07:44:45Z

0

let arr = []; 
for (let i = 0; i < res.data().productioncompaniesowned.length; i++) { 
    arr.push({ 
        id: i, 
        name: res.data().productioncompaniesowned[i]
    });
};
setData({
    id: "root",
    name: "Production Company Owned",
    children: arr,
});

When u loop, one time, u add one item to state, u not push to arr, Y should have array outside and loop and then add to array. Then,setState() with this data.

answered Dec 2, 2021 at 7:44

Nhut Pham

1859 bronze badges

Collectives™ on Stack Overflow

React js adding array in a useState object property

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related