How To delete items Array in objects state in react

Question

i'm want the each items Array in objects state delete

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      storeData: [{
          "code": "f1",
          "name": "storage-no-1",
          "capacity": 125,
          "temperture": -18,
          "humidity": 3,
          "saveProducts": [{
              "code": "P1",
              "id": "1",
              "name": "product-no-1",
              "size": 20,
            },
            {
              "code": "P1",
              "id": "2",
              "name": "product-no-2",
              "size": 20,
            },
          ]
        },
        {
          "code": "f2",
          "name": "storage-no-2",
          "capacity": 15,
          "temperture": -18,
          "humidity": 25,
          "saveProducts": [{
              "code": "P1",
              "id": "1",
              "name": "product-no-1",
              "size": 20,
            },
            {
              "code": "P1",
              "id": "2",
              "name": "product-no-2",
              "size": 20,
            },
          ]
        },
      ]
    }
  }
}

my function code :

deleteItem = (saveProductsId,storeCode) => {
console.log("obj",saveProductsId)
console.log("ttt",storeCode);
this.setState(prevState => {
prevState.storeData.map(store => {
    if (store.code == storeCode) {
      return {
        ...store,
        saveProducts: [
            ...store.saveProducts.filter(product => product !==  saveProductsId)
        ]
      };
    } else { 
      return store;
    }
  })
})
};

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

I've just realized that saveProducts is an array. You want to remove the items from each of saveProducts inside each storeData object? — adiga
– adiga, Commented Feb 2, 2019 at 14:43
I have updated the answer. If it does't work, I'll delete it — adiga
– adiga, Commented Feb 2, 2019 at 14:52

adiga · Accepted Answer · 2019-02-02 14:58:35Z

4

Go through each item in storeData and filter the saveProducts where the id !== saveProductsId:

this.setState(prevState => {
      const storeData = prevState.storeData.map(s => 
          ({ ...s, saveProducts: s.saveProducts.filter(p => p.id !== saveProductsId) }));
      return { storeData };
  })

edited Feb 2, 2019 at 14:58

answered Feb 2, 2019 at 14:38

adiga

35.4k9 gold badges65 silver badges88 bronze badges

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

8 Comments

adiga Over a year ago

@A.RR Are there any objects in storeData which don't have a saveProducts property?

A.RR Over a year ago

No, all objects have saveProducts property

adiga Over a year ago

I'm not sure if this is the issue but you're missing a comma after "humidity": 3 and "humidity": 25. Just before saveProducts declaration in state

A.RR Over a year ago

I want to remove the selected item from the saveProducts

tenor528 Over a year ago

This answer is the correct one. It seems the question has been updated a few times and there are other bugs in it now. Like in your first setState example you're returning item which is undefined. Your second example doesn't follow the answer here because this answer has 2 array methods (map and filter) and you need both.

|

Collectives™ on Stack Overflow

How To delete items Array in objects state in react

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related