Откуда берется переменная slug в запросе gatsby graphql?

Question

Мы создаем слаг-узел в gatsby-node.js.Затем мы создаем createPage

  const posts = result.data.allMarkdownRemark.edges
  posts.forEach(({ node: post }) => {
    createPage({
      path: `posts${post.fields.slug}`,
      component: PostTemplate,
      context: {
        slug: post.fields.slug,
        testingSomething: "this is a test",
      },
    })
  })

В шаблоне мы запускаем что-то вроде этого.

const PostTemplate = ({ data: post }) => {
  return ( ...)  }

export const query = graphql`
  query($slug: String!) {
    markdownRemark(fields: { slug: { eq: $slug } }) {
      ...
  }
`
export default PostTemplate

Как graphql узнает, что есть слаг?Если это что-то вроде this.props.pageContext.slug хорошо, но что происходит в тайне?

Как заполняется переменная $slug?

Answer 1

Чтобы добавить переменные в запросы компонентов страницы, передайте их в объекте контекста при создании страниц.

Переменные запроса

const posts = result.data.allMarkdownRemark.edges
posts.forEach(({ node: post }) => {
  createPage({
    path: `posts${post.fields.slug}`,
    component: PostTemplate,
    context: {
      slug: post.fields.slug,
      testingSomething: "this is a test",
    },
  })
})