title: Passing params from React-router to query component in Apollo Client 2.1
body: <p>How do you pass <code>match.params</code> in a Route to the new Apollo query component?
  I'm trying to take a React component build pre-Apollo 2.1 and use the new query components to learn how to use them.</p>
  
  <p>My code before:</p>
  
  <pre><code>const Post = ({ data: { loading, error, post } }) =&gt; {
    if (error) return &lt;h1&gt;Error fetching the post!&lt;/h1&gt;
    if (!loading) {
      return (
        &lt;article&gt;
          &lt;h1&gt;{post.title}&lt;/h1&gt;
          &lt;div className='Post-placeholder'&gt;
            &lt;img
              alt={post.title}
              src={`https://media.graphcms.com/resize=w:650,h:366,fit:crop/${post.coverImage.handle}`}
            /&gt;
          &lt;/div&gt;
          &lt;Markdown
            source={post.content}
            escapeHtml={false}
          /&gt;
        &lt;/article&gt;
      )
    }
    return &lt;h2&gt;Loading post...&lt;/h2&gt;
  }
  
  export const singlePost = gql`
    query singlePost($slug: String!) {
      post: Post(slug: $slug) {
        id slug title
        coverImage { handle }
        content dateAndTime
      } }`
  
  export default graphql(singlePost, {
    options: ({ match }) =&gt; ({
      variables: {
        slug: match.params.slug
      }
    })
  })(Post)
  </code></pre>
  
  <p>Here is the new code:</p>
  
  <pre><code>const Post = (slug) =&gt; (
    &lt;Query query={singlePost} variables={{slug: slug.match.params.slug}}&gt;
      {({ loading, error, post }) =&gt; { 
        if (loading || !post) return &lt;h2&gt;Loading post...&lt;/h2&gt;
        if (error) return &lt;h1&gt;Error fetching the post!&lt;/h1&gt;
        return (
          &lt;article&gt;
          &lt;h1&gt;{post.title}&lt;/h1&gt;
          &lt;div className='Post-placeholder'&gt;
            &lt;img
              alt={post.title}
              src={`https://media.graphcms.com/resize=w:650,h:366,fit:crop/${post.coverImage.handle}`}
            /&gt;
          &lt;/div&gt;
          &lt;Markdown
            source={post.content}
            escapeHtml={false}
          /&gt;
        &lt;/article&gt;
        )
      }}
    &lt;/Query&gt;
  )
  
  export const singlePost = gql`
        query singlePost($slug: String!) {
          post: Post(slug: $slug) {
            id slug title
            coverImage { handle }
            content dateAndTime
          } }`
  
  export default Post;
  </code></pre>
  
  <p>I console.log <code>post</code> get an empty object, I console.log <code>slug.match.params.slug</code> I get the slug for the post that was passed by React-router. No errors in the console either, I get the loading screen then a black page. Also Apollo Dev tool shows the data from the query in the cache.</p>