graphql - Gatsby - 对 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
}
}
}
}
`;
现在我得到的console.log(data)
只是undefined
.
如果我执行相同的查询但useStaticQuery
所有数据都硬编码 - 我会得到所需的数据。但useStaticQuery
不接受变量。
我在这里做错了吗?如何将变量传递给查询并将我的数据放入道具?
解决方案
Gatsby 在构建时使用 GraphQL,而不是用于实时站点。如此处所述所以它不适合在旅途中进行 GraphQL 查询。
推荐阅读
- javascript - 从日期时间字符串获取偏移量并应用于新的日期对象
- database - 表分区和映射如何工作?
- java - JPanel 底部奇怪的白色边框
- javascript - 使用 jquery 删除动态创建的元素(带有单独的删除按钮)
- javascript - input `type=image` onclick 解决方案有效,但为什么呢?
- pandas - 如何从 pandas.DataFrame.describe() 中提取最高值?
- python - 如何在tensorflow中多次运行模型?
- http - 从 http 站点提取音频流(在线广播)
- html - 根据容器宽度减小标签文本大小
- c++ - 为什么这个 stl 函数调用会导致不正确的布尔评估?