如何在 gatsby graphql 中传递变量

Question

我想根据同一组件的每次渲染传递的图像相对路径来渲染多个图像。 这是我的代码

import Img from "gatsby-image";
import {useStaticQuery, graphql } from "gatsby";
const TeamMemberCard = ({ name, imageSrc, bio }) => {

    const imageData=useStaticQuery(graphql`query MyQuery {
        file(relativePath: {eq: ${imageSrc}}) {
          childImageSharp {
            fluid {
              aspectRatio
              base64
              sizes
              src
              srcSet
            }
          }
        }
      }`);

然后在 JSX 中，我使用图像数据：

    <Img fluid={imageData.file.childImageSharp.fluid} alt="nothing"/>

但无法使用

imageSrc

作为

graphql

的变量。

Answer 1

这个方法行不通。请阅读 gatsby 文档。使查询参数化的唯一方法是将变量添加到

createPage

API，如 gatsby 文档

中所述