在 Gatsby 中创建没有 createPages API 的变量？答案

【问题标题】：Create variables without the createPages API in Gatsby?在 Gatsby 中创建没有 createPages API 的变量？
【发布时间】：2021-07-20 02:21:31
【问题描述】：

我想知道是否可以在组件模板之外使用通过 createPages API 创建的变量。

我的情况是我创建了一个这样的变量：

            pages.forEach(page => {
                createPage({
                    path: `${page.slug}`,
                    component: path.resolve(`src/templates/page-template.js`),
                    context: {
                        title: page.title // My Variable
                    },
                })

现在，在我的 page-template.js 文件中，我导入了一个组件，该组件包含一个外部 graphql 查询，该查询未包含在 page-template.js 文件中，但我想在查询中使用变量。

我可以在 Gatsby 中不使用 createPages API 创建变量吗？

【问题讨论】：

标签： javascript reactjs graphql gatsby

【解决方案1】：

您可以通过 pageContext 属性访问它。例如：

const YourComponent = ({ pageContext }) => 
  <SomeOtherComponent title={pageContext.title} />

这假设 SomeOtherComponent 正在针对外部数据库而不是本地 Gatsby GraphQL 服务器运行此 GraphQL 查询。

【讨论】：

非常感谢！这对我帮助很大。