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

Question

我想知道我是否可以在组件模板之外使用我通过 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 文件中，但我想在查询中使用变量。

我可以在没有 createPages API 的情况下在 Gatsby 中创建变量吗？

Answer 1

您可以通过 pageContext 道具访问它。例如：

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

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

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

Create variables without the createPages API in Gatsby?

javascript

reactjs

graphql

gatsby