CODEWITHSUNDEEP
reactjsreact-nativeuse-state
sachin murali
sachin murali

Reputation: 489

How to useState to update mutiple items in an array of objects?

let initialData =   [
{ id: 1, value: "EXPLORER", status:false, name:'explorer'},
{ id: 2, value: "YIDINJI-ADMIN", status:false, name:'yidinji' }]

  let [data,setData] = useState(initialData)

The above give data is my initial state of array, Sometimes I have to update multiple items using a single map function

    let newData =  await data.map(item => {
      (item.id === 1)? {...item, status : true} : item;
      (item.id === 2)? {...item, status : true} : item;
    })

    setData(newData)

I have tried multiple ways to update the status of two data in a single map function, but nothing is working. Help will be appreciated!

Upvotes: 0

Views: 29

Answers (2)

Viet
Viet

Reputation: 12787

You forgot return in map. Just add return like this:

let newData = await data.map((item) => {
  return item.id === 1 ? { ...item, status: true } : item;
});

setData(newData);

Update, if you want update multyiple items, you can do like this:

let newData = await data.map((item) => {
  let result = item;
  if (item.id === 1 || item.id === 2) {
    result = { ...item, status: true };
  }
  return result;
});

setData(newData);

Upvotes: 2

Muhammad Jaan
Muhammad Jaan

Reputation: 281

This will help you. You forgot to return item.

let newData = data.map(item => {
    
      if (item.id === 1 || item.id===2){
      item.status=true
      }
      return item
    })

Upvotes: 1

Related Questions