Graphql / Gatsby 试图按相对目录过滤

Question

我正在尝试按图像的父目录对图像进行排序以用于单独的画廊。我的目录看起来像 /images/gallery-one。我想我已经接近了，但无论出于何种原因，我都无法通过 relativePath 过滤它。

任何帮助都将不胜感激，即使只是将我送到正确的方向。

import React from 'react'
import { graphql, useStaticQuery } from "gatsby"
import Img from 'gatsby-image'


const ImageGallery = () => {


const data = useStaticQuery(graphql`
query {
  images: allFile(filter: { sourceInstanceName: {eq: "images" }}) {
    edges {
      node {
        relativePath
        childImageSharp {
          id
          fluid {
            originalImg
          }
        }
      }
    }
  }
}
`)

const galleryImages = data.images.edges.node.filter(img => {
 

})

console.log(data)


    return (
        <div>
            <h1>Gallery One</h1>
        </div>
    )
}


export default ImageGallery

Answer 1

应该可以。使用您的 GraphQL 查询和以下过滤器语句，您将获得像这样的 gallery-one 图像：

    data.images.edges.filter(edge =>
      edge.node.relativePath.startsWith("gallery-one")
    )

（请记住，edges 是一个列表，其中每个项目都包含一个node，而relativePath 将是例如gallery-one/b.png）

这是我的图片目录结构：