如何将特定上下文注入 Gatsby 中的所有页面?

MnZ*_*ZrK 7 gatsby

使用gatsby-node.jscreatePages我可以查询一些使用graphql,并使用该页面的东西作为页面的上下文。所以这些页面可以在他们的查询中使用这些东西作为参数。

我面临的问题是我不想使用createPages. 我完全罚款与默认情况下(从创建的页面gatsby-plugin-page-creator),我只希望他们都具有一些从graphql作为上下文。

基本上我想要一个全局上下文(我从 gatsby graphql 获得)可用于所有页面。

onCreatePage钩子,但不幸的是,根据https://github.com/gatsbyjs/gatsby/issues/3121#issuecomment-348781341,graphql在那里不可用。

yen*_*yen 1

那怎么样...您可以尝试在文件中使用onCreateNode()gatsby-nodejs挂钩。例如:

const allMyPageNodes = [];

exports.onCreateNode = ({ node, actions, getNode }) => {
  const { createNodeField } = actions;
  if(...) { //whatever filtering you need to select JUST pages in your site
    const mySpecialContext = "blah"; //whatever your global context settings are
    createNodeField({ node, name: "myglobal", value: mySpecialContext });
    allMyPageNodes.push(node);
  }
}
Run Code Online (Sandbox Code Playgroud)

````

然后,在此后的所有 graphql 查询中,对于页面,graphql 有效负载应填充edge.node.fields.myglobal,并且您应该能够使用它执行任何您喜欢的操作。另请参阅https://www.gatsbyjs.org/docs/static-query/以直接从组件内部查询。

HTH。