React - Access JSON array data and its sub data-CodePudding

This is my JSON array Which is related to some personal data and I want to access these data from my react app this JSON file is in my react app

{
    "person": [
      {
        "id": "userId",
        "sellerImage": "https://i.pravatar.cc/300",
        "lastOnline": "Date of last online",
        "sellerName": "Ryann Remo",
        "isOnline": true,
        "lastSeenDate": "Today",
        "product":"Rough Shirt",
        "messages": [
          {
            "id": "messageId",
            "userId": "userIdOfUser",
            "message": "Message text 01",
            "date": "Date of message",
            "time": "time of message",
            "isRead": false
          },
          {
            "id": "messageId",
            "userId": "userIdOfSeller",
            "message": "Message text 02",
            "date": "Date of message",
            "time": "time of message",
            "isRead": true
          },
          {
            "id": "messageId",
            "userId": "userIdOfSeller",
            "message": "Message text",
            "date": "Date of message 03",
            "time": "time of message",
            "isRead": false
          }
        ]
      },

      {
        "id": "userId",
        "sellerImage": "https://www.gravatar.com/avatar/205e460b479e2e5b48aec07710c08d50",
        "lastOnline": "Date of last online",
        "sellerName": "Karp Bonolo",
        "isOnline": true,
        "lastSeenDate": "Yesterday",
        "product":"Rough Shirt",
        "messages": [
          {
            "id": "messageId",
            "userId": "userIdOfUser",
            "message": "Message text",
            "date": "Date of message",
            "time": "time of message",
            "isRead": false
          },
          {
            "id": "messageId",
            "userId": "userIdOfSeller",
            "message": "Message text",
            "date": "Date of message",
            "time": "time of message",
            "isRead": true
          },
          {
            "id": "messageId",
            "userId": "userIdOfSeller",
            "message": "Message text",
            "date": "Date of message",
            "time": "time of message",
            "isRead": false
          }
        ]
      }
    ]
  }

I need to access "message": "Message text" in this JSON file from a react application. How Can I do that ???

(Example I need to print Message text 01 Message text 02 Message text 03 In my React App how can I do that ??? )

Just need a small example to access this sub-data only. I need to print the above-highlighted text in my ract app.

CodePudding user response：

That might help if you provided an example of the code you currently have. But you might need to do something like this.

  person.messages.map(item => {
    return <span>{item.message}</span>
  })

CodePudding user response：

Your can access it like this in react app...

YOUR_ARRAY.person.map(firstObject => {
  firstObject.messages.map(secondMessageObject => {
    return <h2>
      {secondMessageObject.message}
    </h2>
  })
})

if it works, kindly accept it as answer here :)