Как получить доступ к переменной контекста в компоненте шаблона в Гэтсби?

Question

В компоненте реагирования в приложении Gatsby я понимаю, как использовать переменную контекста в запросах graphql, например:

export const tagPageQuery = graphql`
  query TagPage($tag: String) {
    site {
      siteMetadata {
        title
      }
    }
    allItem(filter: { tags: { in: [$tag] } }) {
      totalCount
      edges {
        node {

          id
          move
          videoUrl

$tag это строка, которая позволяет мне фильтровать. Я понимаю. Но есть ли способ получить доступ к этому значению внутри самого компонента? Я могу получить доступ к данным, которые получает запрос graphql, но не может получить переменную вне Graphql. Я бы хотел, чтобы это было {context.tag} или что-то в этом роде, чтобы я мог использовать это значение в моем h1. Я прошёл справку Gatsby GraphQL и ни одного кубика. Такое ощущение, что получить это значение должно быть легко, но мне интересно, нужно ли мне использовать что-то вроде getContext hook?

Answer 1

Удивительно, что может сделать 10-минутный мини-сон! В самом деле, вы можете получить доступ к переменным контекста с помощью реквизита pageContext, подробно описанного здесь: https://www.gatsbyjs.org/docs/creating-and-modifying-pages/#creating-pages-in-gatsby-nodejs

const TagPage = ({ data, classes , pageContext}) => {

Добавление pageContext к моим реквизитам позволило мне получить доступ к $tag.