Question

我正在尝试通过props或graphql查询我正在Gatsby的createPage函数中的context选项内部测试的键值对。查看代码：

 createPage({
        path: node.frontmatter.path,
        component: blogPostTemplate,
        context: {
          mycontext: "My Context James",
        }, // additional data can be passed via context
      })

我的页面查询如下：

export const pageQuery = graphql`
  query($path: String!) {
    markdownRemark(frontmatter: { path: { eq: $path } }) {
      html
      frontmatter {
        date(formatString: "MMMM DD, YYYY")
        path
        title
      }
    }
  }
`

如何查询上下文以及thehtml和frontmatter节点？

非常感谢

Answer 1

Pass context to pages。如有疑问，请检查文档。

import React from 'react'
import { graphql } from 'gatsby'

const Page = ({ data, pageContext }) => {
  return (
    <>
      <p>Context: { pageContext.mycontext }<p>
      <p>Title: { data.markdownRemark.frontmatter.title }<p>
    </>
  )
}

export default Page

export const pageQuery = graphql`
  query($path: String!) {
    markdownRemark(frontmatter: { path: { eq: $path } }) {
      html
      frontmatter {
        date(formatString: "MMMM DD, YYYY")
        path
        title
      }
    }
  }
`

Gatsby查询页面模板中的createPage上下文选项

1 个答案: