reactjs - TypeError：无法读取未定义的属性“位图”

Question

我目前正在尝试通过我的 gatsby 应用程序中的 graphQl 从内容访问数据。但是我遇到以下错误，

TypeError：无法读取未定义的位图。

请帮忙。我之前已经从这两个组件中轻松访问了我的数据。当我查询内容时问题开始了

export const query = graphql`
   {
   img: file(relativePath: { eq: "pasta.jpg" }) {
     childImageSharp {
       fluid {
      ...GatsbyImageSharpFluid_tracedSVG
     }
    }
   }

  menu: allContentfulMaloncuisine {
   edges {
    node {
    id
    title
     description {
       description
      }
      price
      category
      image {
       fixed(width: 50, height: 50) {
        ...GatsbyContentfulFixed_tracedSVG
        }
       }
     }
    }
   }
  }`

const IndexPage = ({ data }) => (
  <Layout>
    <SEO title="Home" />
    <BackgroundSection
      img={data.img.childImageSharp.fluid}
      title="malons' Eat"
      styleClass="pasta"
    />
    <Info />
    <Menu items={data.menu} />
  </Layout>
)

const AboutPage = ({ data }) => (
  <Layout>
    <SEO title="Home" />
    <BackgroundSection
      img={data.img.childImageSharp.fluid}
      title="about us"
      styleClass="cook"
    />
    <Info />
  </Layout>
)

Answer 1

根据您的查询，_tracedSVG从图像中删除

示例： ...GatsbyImageSharpFluid_tracedSVG 应该是： ...GatsbyImageSharpFluid

对于类似的问题，这对我有用。祝你好运。