Map through array that includes object-CodePudding

Below is the response coming back. I'm trying to map through the logo object so that I can grab the url, however my implementation on Object.keys is not working. What am I doing wrong?

[
  {
    "title": "Header",
    "logo": {
      "metadata": {},
      "sys": {},
      "fields": {
        "title": "Logo",
        "file": {
          "url": "xxxxxx",
          "details": {},
          "fileName": "logo.png",
          "contentType": "image/png"
        }
      }
    },
    "links": []
  }
]

{Object.keys(header.logo.fields.file).map((logo) => (
    <p>{logo.url}</p>
))}

CodePudding user response：

Assuming the top-level array name is header, just do this. Note that the top-level structure is an array, so you need an index to get the object inside.

<p>{header[0].logo.fields.file.url}</p>