GraphQL查询可在Gatsby页面中使用，但不能在类组件中使用

那是因为您不能在组件中使用像这样的graphql。

要在组件中使用graphql，您有两个选择：

useStaticQuery

StaticQuery

为

useStaticQuery

import React from "react"import { useStaticQuery, graphql } from "gatsby"const MyElement = () => {  const data = useStaticQuery(graphql`     query about {       prismicabout {         data {intro_headline {  text}intro_paragraph {  text}         }       }     }   `)   return (      <StyledIntro>        <h3>about</h3>        <h1>{this.props.data.prismicabout.data.intro_headline.text}</h1>      </StyledIntro>   )}export default MyElement

与

staticQuery

import React from 'react'import { StaticQuery, graphql } from 'gatsby';const MyElement = () => {   return(      <StaticQuery query about {   prismicabout {     data {        intro_headline { text } intro_paragraph {    text }        }     }  }         `}         render={data => ( <StyledIntro>    <h3>about</h3>    <h1>{this.props.data.prismicabout.data.intro_headline.text}</h1> </StyledIntro>         )}      />   )}export default MyElement

希望对您有所帮助！