[SOLVED]Apollo - props can be console.logged but not rendered

Hey everyone,
It’s all in the title. I can’t figure why I can console.log the title of the post but not render it (nor pass it as a prop for a child component). What’s going wrong here ?


import React from 'react';
import { graphql } from 'react-apollo';
import gql from 'graphql-tag';

const EditHeader = (props) => (
  <div>
//  {props.data.Post.title} -> this won't work
    <button onClick={() => console.log(props.data.Post.title)}>Console</button>
  </div>
 )

const FeedEditedPost = gql`query GetPost {
  Post (id: "345"){
    imageUrl
    title
    description
    content
    order
    h
    __typename
  }
}
`
const EditPostWithData = graphql(FeedEditedPost)(EditHeader)
export default EditPostWithData

Edit : comp was rendered before it had the time to load. Solved with adding

if (this.props.data.loading) {
  return (<div>Loading</div>)
}
1 Like

Hey! I just wanted to thank you for updating your post once you found the solution. I was working on this for hours before I found your post and it solved my issue. Thanks again!

1 Like