title: How to pass variables to a GraphQL query?
body: <p>Lets assume I have the following GraphQL query in React-Apollo</p>
  
  <pre><code>const CurrentUserForLayout = gql`
    query CurrentUserForLayout($avatarID: Int!) {
      currentUser {
        avatar_url(avatarID: $avatarID)
      }
    }
  `;
  
  const ProfileWithData = graphql(CurrentUserForLayout, {
    options: { variables: { avatarID: 1 } },
  })(Profile);
  </code></pre>
  
  <p>Now if I want to let my React component <code>Profile</code> change the avatarID,</p>
  
  <p>how would I do that?</p>
  
  <p>I am new to React and GraphQl and I do not really understand the connection here: </p>
  
  <pre><code>graphql(CurrentUserForLayout, {
        options: { variables: { avatarID: 1 } },
      })(Profile);
  </code></pre>
  
  <p>Do I really need another parent component around <code>ProfileWithData</code>
  to pass another <code>avatarID</code> to the query? But what if the ID is manipulated by the Profile component, how do I let the Parent component know about that?</p>