Finding image uri in a nested array

April 14, 2022

I am trying to get the image uri from this payload. I can get to the image array with this but no further.

bikesArray.map(bikes => bikes.customerBikeImage.assets)

The entire payload is like this.

  {
"customerBikeComponents": "SRAM",
"customerBikeCondition": "Used",
"customerBikeImage": {
  "assets": [
    Array
  ]
},
"customerBikeMake": "Planet C",
"customerBikePrice": "1500",
"customerBikeRegister": "Yes",
"customerBikeSize": "80"

Then the array within the payload is:

  [
{
  "fileName": "BA459947-3C2A-49CE-8E44-D74B92D5EA49.jpg",
  "fileSize": 3583973,
  "height": 3088,
  "type": "image/jpg",
  "uri": "file:///var/mobile/Containers/Data/Application/DF4C4FB4-191F-4101-9A11-4FD728B3CE4B/tmp/BA459947-3C2A-49CE-8E44-D74B92D5EA49.jpg",
  "width": 2316
}

I am trying to get to the uri and assign that to a state.
i have tried several different ways to no avail and thought I would get some help.

>Solution :

hope this will help,

if you have mutiple imageUri
and you want your end result looking like that:

[
[www.sampleImage1.jpg,www.sampleImage2.jpg],
[www.sample2Image1.jpg,www.sample2Image2.jpg]
]

you need to map on the nested array as well.

bikesArray.map(
    bike =>{
     let imageUri;               
     /** if there are multiple uri  */
     imageUri= bike.customerBikeImage.assets.map(fileData=>fileData.uri)
     return imageUri
   }
)

if you have only one imageUri in the array
and you want your end result looking like that:

[
www.sampleImage1,
www.sample2Image1
]

just take the first element.

bikesArray.map(
    bike =>{
     let imageUri;                  
    /*if there is only one uri */   
     imageUri= bike.customerBikeImage.assets[0].uri
     return imageUri
   }
)