Graphql 盖茨比-对Contentful进行动态查询

我正在开发一个基于

Gatsby

和

Contentful

的简单电子商务。 我的一个页面是

CartPage

。 因此，我试图对

Contenful

进行查询，以获取有关我的产品的必要信息，因此我希望传递用户购物车中的产品ID列表

以下是我的组件和查询：

export interface CartPageProps {
  data: {
    products: GQL.ContentfulProductConnection;
  };
}

const CartPage = ({ data }: CartPageProps) => {

  const mockCart = [1, 2];
  console.log(data);

   return (
    <IndexLayout>
      <Page>
      //
      // Layout goes here
      //
      </Page>
    </IndexLayout>
    )
}
export default CartPage;

const pageQuery = graphql`
  query ProductsInCart($mockCart: [Int], $lang: String) {
    products: allContentfulProduct(filter: { idProduct: { in: [1, 2] }, node_locale: { eq: "en" } }) {
      edges {
        node {
          id
          idProduct
          price
          title
          quantity
          photo {
            resize(height: 200, width: 200) {
              src
            }
          }
          slug
        }
      }
    }
  }
`;

导出接口CartPageProps{
数据：{
产品：GQL.ContentfulProductConnection；
};
}
常量CartPage=（{data}:CartPageProps）=>{
常量mockCart=[1,2]；
控制台日志（数据）；
返回(
//
//布局在这里
//
)
}
导出默认CartPage；
const pageQuery=graphql`
查询产品购物车（$mockCart:[Int]，$lang:String）{
产品：allContentfulProduct（过滤器：{idProduct:{in:[1,2]}，节点\语言环境：{eq:“en”}）{
边缘{
节点{
身份证件
idProduct
价格
标题
量
照片{
调整大小（高度：200，宽度：200）{
src
}
}
鼻涕虫
}
}
}
}
`;

现在，我在

控制台上得到的所有日志（数据）

都是

未定义的

如果我使用

useStaticQuery

和所有硬编码的数据执行相同的查询，我会得到所需的数据。但是

useStaticQuery

不接受变量

---

我做错什么了吗？如何将变量传递给查询并将数据放入props？

盖茨比在构建时使用GraphQL，而不是用于实时站点。如前所述，它并非用于在运行中进行GraphQL查询。

看起来您可能忘记了导出GraphQL查询？@DerekNguyen您是对的，但我认为情况并非如此。我认为问题在于，

Gatsby在构建时使用GraphQL，而不是用于实时站点。

如前所述，它不用于在运行时进行GraphQL查询，例如

fetch（）

。@SergeiKlinov是的，您回答了自己的问题。