How to remove specific item from JSON object correctly in REACT js?

Question

In REACT JS, I have a JSON object in state component "myrecords" where items are grouped by their Company Names and it has following format:

{
        "Master Automotives": [
            {
                "SparePartID": "43",
                "Name": "Oil and Lubricants",
                "Price": "4500",
                "VendorID": "48",
                "CompanyName": "Master Automotives",
                 "Qty": 1,
                 "TotalPrice": "4500"

            },
            {
                "SparePartID": "45",
                "Name": "Lights",
                "Price": "2300",
                "VendorID": "48",
                "CompanyName": "Master Automotives",
                 "Qty": 1,
                 "TotalPrice": "2300"
            }
        ],

        "Repair Solutions": [
            {
                "SparePartID": "47",
                "Name": "Steering Wheel",
                "Price": "1500",
                "VendorID": "60",
                "CompanyName": "Repair Solutions",
                 "Qty": 1,
                 "TotalPrice": "1500"
            }
        ],
        

         "FiveStar Automotives": [
            {
                "SparePartID": "51",
                "Name": "Brakes",
                "Price": "234",
                "VendorID": "70",
                "CompanyName": "FiveStar Automotives",
                 "Qty": 1,
                 "TotalPrice": "234"
            },
            {
                "SparePartID": "53",
                "Name": "Clutch",
                "Price": "999",
                "VendorID": "70",
                "CompanyName": "FiveStar Automotives",
                 "Qty": 1,
                 "TotalPrice": "999"
            },
              {
                "SparePartID": "55",
                "Name": "LED",
                "Price": "288",
                "VendorID": "70",
                "CompanyName": "FiveStar Automotives",
                 "Qty": 1,
                 "TotalPrice": "288"
            }
        ]
    
}

Im using this method to remove a specific item from myrecords state whenever delete button against an item is clicked:

removeCartItem(CompanyName, sid,e)
{

  const items = {...this.state.myrecords};
  const j = items[CompanyName].findIndex(item => item.SparePartID === sid);

  items[CompanyName].splice([j], 1);

  this.setState({
     myrecords: items
   });
   
   }

Im sending CompanyName, SparePartID as sid in parameters of function to perform delete.

It works Perfectly FINE and deletes the item on which I click.

But problem is if a Company has only 1 item and I delete it, then still the myreocords JSON Object contains that Company with an empty array(no items). Instead I wanted it to delete such a Company who has no Items left in it.

SO that myrecords state should have only those Companies Data whose items are present.

Please help me to solve this Problem.

Vlad Agurets · Accepted Answer · 2019-05-04 07:44:52Z

4

You should to remove node if it have no items:

removeCartItem(CompanyName, sid,e) {

  const items = {...this.state.myrecords};
  const j = items[CompanyName].findIndex(item => item.SparePartID === sid);

  items[CompanyName].splice([j], 1);

  // rm company node if it have no items
  if (items[CompanyName].length === 0) {
    delete items[CompanyName]
  }

  this.setState({
     myrecords: items
   });

 }

answered May 4, 2019 at 7:44

Vlad Agurets

3423 silver badges7 bronze badges

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

Collectives™ on Stack Overflow

How to remove specific item from JSON object correctly in REACT js?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related