graphQL：如何在查询

Question

我正在尝试在GatsbyJS项目中使用graphQL，并且我不确定如何在'recipeImages'对象中从三个列表中提取特定的“URL”对象。现在，我只能拉出recipeImages对象，如下所示：

<img src={node.recipeImages}/>

但我希望能够访问此查询中显示的三个单独的URL对象：

{
  "data": {
    "allContentfulBlogPost": {
      "edges": [
        {
          "node": {
            "id": "c1Qz3hWuPuQEIIUkSos0MEO",
            "postTitle": "Schwarzwälder Kirschtorte",
            "postDate": "2018-01-30T00:00+01:00",
            "slug": "schwarzwälder-kirschtorte",
            "methodText": {
              "childMarkdownRemark": {
                "html": "<p>This is the method text</p>"
              }
            },
            "recipeImages": [
              {
                "title": "imageOne",
                "file": {
                  "url": "//images.contentful.com/62o0h4ehxjxr/kkc57vWLPaEakYueyYqC6/c61b4641797a2fcaf3476ef9a3a24db6/image.jpg"
                }
              },
              {
                "title": "imageTwo",
                "file": {
                  "url": "//images.contentful.com/62o0h4ehxjxr/2ifxQEvnYwkaAe6e2YKISa/de2b6f62c4cac3b501fe76146b745790/image1.jpg"
                }
              },
              {
                "title": "imageThree",
                "file": {
                  "url": "//images.contentful.com/62o0h4ehxjxr/17g7ZHqrEWIgcyuye08myG/6b55386a31db2dd319148795953da7a4/image2.jpg"
                }
              }
            ]
          }
        }
      ]
    }
  }
}

Answer 1

我明白了：

<img src={recipeImages[0].responsiveResolution.src}/>