I'm using Expo router with React-Native. So it needs to be able to work with the Expo framework.

My app uses a FlatList to generate a list of profiles. When the user taps on a profile, it needs to send them to the corresponding individual profile.

For example, If the user selects "Jason Smith", clicking the button will lead them to a page populated with just Jason's information.

When I make a FlatList, all the objects are shown. As a bad workaround, I'm manually sending the properties I need with a Pressable.

My page layout looks like this:

    app
      index.jsx
      _layout.jsx
      characters
        [uid].jsx
        _layout.jsx

I'm using a Pressable to pass the parameters from index.jsx to [uid].jsx but this only works for non-array properties. I want to show the characteristics for Jason Smith on his individual page but because it's in an array, I'm unable to pass all the related properties.

    <Pressable onPress={() => router.push({
      pathname: "/characters/[uid]",
      params: {
      uid: (item.uid),
      firstName: (item.firstName),
      lastName: (item.lastName),
      },
    })}>

Is it possible to use a FlatList to obtain a single object by a key? If not, is there another way I can get the outcome I'm looking for?

JSON example:

"results":[
  {
    "id": "BU0AE"
    "firstName": "Jason",
    "lastName": "Smith",
    "Age": 32,
    "characteristics": [
      {
        "hairColor": "Black",
        "eyeColor": "Brown",
        "tattoos": "N",
      }
    ],
    "hobbies": "fishing",
  },
  {
    "id": "LK3PO"
    "firstName": "Mary",
    "lastName": "McDonald",
    "Age": 29,
    "characteristics": [
      {
        "hairColor": "Red",
        "eyeColor": "Blue",
        "tattoos": "Y",
      }
    ],
    "hobbies": "Art",
  },
  {
    "id": "AR2K1"
    "firstName": "Emma",
    "lastName": "Dawn",
    "Age": 30,
    "characteristics": [
      {
        "hairColor": "Purple",
        "eyeColor": "Hazel",
        "tattoos": "N",
      }
    ],
    "hobbies": "Singing",
  },
]