title: Trying to use React Apollo Query component for GraphQL query with typescript causing error
body: <p>I'm trying to query a GraphQl API with Apollo. I'm doing it in React with typescript and I can't get the Query component to stop throwing errors. 
  I'm new to this whole combination, so I might be doing something obviously wrong. Any ideas?</p>
  
  <p>Here's the error:</p>
  
  <pre><code>Type '{ children: (string | (({ loading, error, data }: QueryResult&lt;any, OperationVariables&gt;) =&gt; any))[]; query: any; }' is not assignable to type 'Pick&lt;Readonly&lt;QueryProps&lt;any, OperationVariables&gt;&gt; &amp; Readonly&lt;{ children?: ReactNode; }&gt;, "children" | "displayName" | "skip" | "onCompleted" | "onError" | "ssr" | "variables" | ... 6 more ... | "partialRefetch"&gt;'.
    Types of property 'children' are incompatible.
      Type '(string | (({ loading, error, data }: QueryResult&lt;any, OperationVariables&gt;) =&gt; any))[]' is not assignable to type '((result: QueryResult&lt;any, OperationVariables&gt;) =&gt; ReactNode) | (((result: QueryResult&lt;any, OperationVariables&gt;) =&gt; ReactNode) &amp; string) | (((result: QueryResult&lt;any, OperationVariables&gt;) =&gt; ReactNode) &amp; number) | ... 4 more ... | (((result: QueryResult&lt;...&gt;) =&gt; ReactNode) &amp; ReactPortal)'.
        Type '(string | (({ loading, error, data }: QueryResult&lt;any, OperationVariables&gt;) =&gt; any))[]' is not assignable to type '((result: QueryResult&lt;any, OperationVariables&gt;) =&gt; ReactNode) &amp; ReactNodeArray
  </code></pre>
  
  <p>Here's my code:</p>
  
  <pre><code>import React from 'react';
  import gql from "graphql-tag";
  import { Query } from "react-apollo";
  
  
  export interface LoginProps { 
      data: object; item: string; query: object; loading: string; error: string;
   };
  
   const getLogin =
      gql`
          {
          viewer {
              login
              }
          }
      `;
  
  export class Test extends React.Component&lt;LoginProps, {}&gt; { 
      &lt;Query query={getLogin}&gt;
              {({ loading, error, data }) =&gt; {
                  if (loading) return &lt;p&gt;Loading...&lt;/p&gt;;
                  if (error) return &lt;p&gt;Error!&lt;/p&gt;;
  
                  return data.viewer.map( item =&gt; {
                      &lt;div key={item.login}&gt;
                          &lt;p&gt;{item.login}&lt;/p&gt;
                      &lt;/div&gt;
                  });
              }};
      &lt;/Query&gt;
  };
  
  export default Test;
  </code></pre>