从Markdown对数组使用Gatsby-image

时间:2019-09-23 12:38:49

标签: reactjs graphql gatsby

我正在使用Gatsby,并且具有在数组中每个markdown文件中引用的图像。我希望能够使用Gatsby-image转换这些图像,但无法使其与数组配合使用。

在Markdown中处理单个图像时,我可以使它工作

我有这个查询来获取数据:

query($slug: String!) {
    markdownRemark(fields: { slug: { eq: $slug } }) {
      html
      frontmatter {
        id
        category
        title
        path
        prices
        salePercent
        images
      }
    }
  }

我有这个来自降价促销

mainImage: './images/1.jpg'

images: ['1', '2', '3', '4', '5', '6']

我可以使gatsby-image与mainImage一起正常工作,但不能使查询与数组一起工作。

我希望能够获得gatsby-image与数组配合使用并转换每个图像。

1 个答案:

答案 0 :(得分:0)

您可以像这样在前端使用YAML格式:

images:
- image: "home-DSC_0035.jpeg"
  image_alt: "beautiful photo"
- image: "home-DSC_0045.jpg"
  image_alt: "This is better"
- image: "home-DSC_0043.jpg"
  image_alt: "This is much better"

您将获得数组。