1

How can we map nested objects in ReactJS?

{
   "Data1":{
      "attribute1":{
         "key":"discount",
         "value":"50% off"
      },
      "attribute2":{
         "key":"original_price",
         "value":"Rs. 998"
      },
      "attribute3":{
         "key":"img",
         "value":[
            ""
         ]
      },
      "attribute4":{
         "key":"product_url",
         "value":"https://www.flipkart.com/3six5-combo-pack-2-men-sports-running-shoes-walking/p/itm45eecec10cd8d"
      },
      "attribute5":{
         "key":"title",
         "value":"3SIX5 - Combo pack of 2 Men Sports & Running Sports Shoes Walking Shoes For Men"
      },
      "attribute6":{
         "key":"price",
         "value":"Rs. 498"
      },
      "buttonReference":"Button1"
   }
}
}

This data is fetched from the server and I want to traverse through each element, and for that I want to map this data.

Agent K
  • 359
  • 4
  • 17
Naga
  • 11
  • 1
  • 1
    Does this answer your question? [React - how to map nested object values?](https://stackoverflow.com/questions/43423694/react-how-to-map-nested-object-values) – Hoppeduppeanut May 19 '21 at 05:46

1 Answers1

1

Use Object.keys() to map over all keys. Object.keys() reference

Object.keys(data).map(key => {
    const value = data[key];
    // do whatever you want with the data
});
Manuel
  • 188
  • 1
  • 12