gatsby - 如何将变量从 'context' 传递给页面查询？ | Gatsby

Question

尝试将“上下文”变量传递给页面查询时出现错误，提示未提供该变量。

来 self 的 gatsby-node.js 文件:

createPage({
  path: `/portfolio/${pg.order}`,
  component: require.resolve("./src/pages/portfolio.js"),
  context: { pgNum: pg.order },
})

我的页面查询:

export const query = graphql`
  query($pgNum: Int!) {
    strapiPortfolioPages(order: { eq: $pgNum }) {
      layer
      widths
      ...
    }
  }

Gatsby 告诉我:“未提供所需类型“Int!”的变量“$pgNum”。

Answer 1

"Variable "$pgNum" of required type "Int!" was not provided."

这意味着你的 $pgNum 变量是不可空的，因为 Int! 因为感叹号 (!) 代表一个GraphQL 中的不可空(必需)值(有关更多信息，请查看 Schema and Types GraphQL documentation )。换句话说，您的查询将一个 null 值传递给一个不可为 null 的变量，因此您在某处有一个 null 值。

绕过它的一种简单方法(在检查您的值之后)是通过以下方式删除查询的可空性:

export const query = graphql`
  query($pgNum: Int) {
    strapiPortfolioPages(order: { eq: $pgNum }) {
      layer
      widths
      ...
    }
  }