盖茨比：用JavaScript定义静态查询？

因此，在页面中，您可以在javascript中将查询定义为对象，并将其作为

数据

属性自动传递给组件

在组件中，这不会发生，我看到的示例显示了以声明方式定义为标记一部分的查询，然后将其交给呈现方法。我真的一点也不喜欢那样

盖茨比用什么方法在组件的JS中定义graphql查询，然后在该组件中使用它

例如：

  <Img fixed={data.logo.childImageSharp.fixed} />

这是一个使用graphql数据对象的盖茨比图像。但该对象仅在页面上可用，而不是在组件上可用。（现在我正在将数据道具从页面传递到组件中，但这不是我想要的）

在文档中签出

import React from "react"
import { useStaticQuery, graphql } from "gatsby"
export default () => {
  const data = useStaticQuery(graphql`
    query HeaderQuery {
      site {
        siteMetadata {
          title
        }
      }
    }
  `)
  return (
    <header>
      <h1>{data.site.siteMetadata.title}</h1>
    </header>
  )
}`

从“React”导入React
从“盖茨比”导入{useStaticQuery，graphql}
导出默认值（）=>{
常量数据=useStaticQuery（graphql`
查询标题查询{
场地{
站点元数据{
标题
}
}
}
`)
返回(
{data.site.siteMatadata.title}
)
}`

你能告诉我你想在哪里使用这个查询吗？@ZohaibIjaz补充道