html - 如何将多个图像的文件夹绑定到数据？GraphQL GatsbyJS

Question

我想将包含多个图像的文件夹绑定到我的数据。

我有一些数据：

[
   {
      "title": "data1",
      "images" : "./relimages/first-data/",
      "cardimages" : "./relimages/main-page-card-images/1.jpg",
   },
   {
      "title": "data2",
      "images" : "./relimages/second-data/",
      "cardimages" : "./relimages/main-page-card-images/2.jpg",
   },
   {
      "title": "data3",
      "images" : "./relimages/third-data/",
      "cardimages" : "./relimages/main-page-card-images/3.jpg",
   }
]

但是当我用graphql查询它们时，我只有一个字符串：“./relimages/first-data”

虽然，我的 cardimages 数据条目直接被视为图像。

如何让我的查询将其视为一个文件夹，而不仅仅是返回字符串。

我希望这段代码能够工作：

<h1>{data.title}</h1>
data.images.edges.map(image => return (<img src={image.node.childImageSharp.fluid.src}/>))

这是我当前的 GraphQL 查询：

 query flagquery {
  allDataRoJson {
    edges {
      node {
        images {
          edges {
            node {
              childImageSharp {
                fluid {
                  src
                }
              }
            }
          }
          cardimages {
            id
            childImageSharp {
              fluid {
                originalImg
              }
            }
          }
        }
      }
    }
  }
}

但是我的图像数据条目被视为一个字符串，而不是一个文件夹。这有可能吗？

错误是：

字段 \"images\" 不能有选择，因为类型 \"String\" 没有子字段

标签： htmlreactjsecmascript-6graphqlgatsby