在嵌套数组中查找图像 uri

Question

我正在尝试从此负载中获取图像 uri。我可以用它到达图像阵列，但不能再进一步了。

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

整个payload是这样的

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

},

那么有效负载中的数组是：

  [
{
  "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
}

],

我正在尝试获取 uri 并将其分配给一个状态。我尝试了几种不同的方法都无济于事，我想我会得到一些帮助。

Answer 1

希望这会有所帮助，

如果你有多个 imageUri 你希望你的最终结果看起来像这样：

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

您还需要在嵌套数组上进行映射。

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

如果数组中只有一个 imageUri 你希望你的最终结果看起来像这样：

[
www.sampleImage1,
www.sample2Image1
]

只取第一个元素。

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

Answer 2

当您的数据是对象时，您正在尝试访问数组。

const dataDB = {
  customerBikeComponents: "SRAM",
  customerBikeCondition: "Used",
  customerBikeImage: {
    assets: [
      [
        {
          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
        }
      ]
    ]
  },
  customerBikeMake: "Planet C",
  customerBikePrice: "1500",
  customerBikeRegister: "Yes",
  customerBikeSize: "80"
};

尝试使用 property accessors 并使用 [0] 选择资产数组的第一项完整路线：

data.customerBikeImage.assets[0][0].uri

另请检查此 codesandbox React 示例，其中资产数组具有对象子项。

在嵌套数组中查找图像 uri

Finding image uri in a nested array

arrays

firebase

reactjs

react-native