query-component.js

import React from "react";
import { Query } from "react-apollo";
import { gql } from "apollo-boost";

const MyComponent = props =>
  <Query
    query={MY_QUERY}>
    {({ data, loading, error }) => {
      if (loading) return 'Loading';
      if (error) return `Error!: ${error}`;
      const { things } = data;
      return (
        <div>
          {things.map(({text, id}) => <p key={id}>{text}</p>)}
        </div>
      )
    }}
  </Query>

const MY_QUERY = gql`
  query {
    things{
      id
      text
    }
  }
`;

export default MyComponent