'How to map an array of object [duplicate]

I have an object like this:

const arr = {
  "items": [{
    "id": "61f5530ffa13c013c514cc5f",
    "name": "Classic",
    "slug": "classics",
    "unit": "1 each",
    "stock": 200,
    "price": 500,
    "quantity": 3,
    "itemTotal": 1500
  }],
  "isEmpty": false,
  "totalItems": 3,
  "totalUniqueItems": 1,
  "total": 1500,
  "meta": null
};

How can I map the above to an h1 element?

I tried this, I know it's wrong

  const myarr = arr.map((item) => {
     return <h1 key={item.id}>{item.name}</h1>
 });


Solution 1:[1]

Your arr is object and arr.Items is array. so you can iterate as

const myarr = arr.items.map((item) => {
 return <h1 key={item.id}>{item.name}</h1>});

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Sudip Thapa