使用Map()函数通过ReactJS提取双嵌套JSON数据

我试图在“详细信息”部分下面的“图像”对象中提取单个图像。

似乎什么也没打印出来。寻找正确的方法来获取details.images.image1,2或3。

这是到目前为止我正在使用的JSON数据:

{
  "books": [
    {
      "title": "title 1","image": "/image1.jpg"
    },{
      "title": "title 2","image": "/image2.jpg"
    }
  ],"details": [
    {
      "author": "book author","name": "Book name","price": 34.99,"publisher": "Penguin Books","images": [
        {
          "image1": "/image1.jpg","image2": "/image2.jpg","image3": "/image3.jpg"
        }
      ]
    }
  ]
}

这也是我在Book组件中进行的JSON调用:

{staticdata.details.map(detail => (
  <Book
    book_name={detail.author}
    book_price={detail.price}
    image={detail.images.image1}
  />
))}
yxfy209 回答:使用Map()函数通过ReactJS提取双嵌套JSON数据

这里是访问这些嵌套属性并将它们记录到控制台的示例。看来您的尝试基本上是正确的,但images是一个数组。

const data = {
  "books": [
    {
      "title": "title 1","image": "/image1.jpg"
    },{
      "title": "title 2","image": "/image2.jpg"
    }
  ],"details": [
    {
      "author": "book author","name": "Book name","price": 34.99,"publisher": "Penguin Books","images": [
        {
          "image1": "/image1.jpg","image2": "/image2.jpg","image3": "/image3.jpg"
        }
      ]
    }
  ]
}

data.details.map(detail => {
  console.log(detail.author,detail.price,detail.images[0].image1);
});

本文链接:https://www.f2er.com/3169727.html

大家都在问