CODEWITHSUNDEEP
javascriptreactjsgraphqlcontentfulgatsby
user74843
user74843

Reputation: 701

GatsbyJS and Contentful: data coming up undefined

I have a Header component in my layout folder, and have made a query to pull out some data. However, when I console.log out this.props.data, I get a result of 'undefined'. Where am I going wrong here? Have I forgotten something in my query?

code for Header component: 

import React, { Component } from 'react'

export default class Header extends Component {
    render() {

        console.log(this.props.data)

      return (
         code for component
      );
    }
  }

  export const headerQuery = graphql`
    query headerQuery {
        allContentfulBlogPost {
            edges {
                node {
                    postTitle
                    postDate
                }
            }
            totalCount
        }
    }
`

Upvotes: 1

Views: 642

Answers (2)

Minh Kha
Minh Kha

Reputation: 1112

Please put your components into /pages folder, restart server again, or through createPage api in gatsby-node.js

Upvotes: 0

chmac
chmac

Reputation: 12625

You can only fetch data from Gatsby via the pageQuery export on a page component. It is not possible to fetch data in other components. This is necessary to allow Gatsby to statically compile your data.

Upvotes: 2

Related Questions