title: How to create an update form with Apollo client in Reactjs
body: <p>I like to edit a list of contacts I fetched from my GraphQL api with Apollo client. I see a lot of examples for add new items via mutations but I cannot find any example of updating existing items. Normally I would create a state object and make the input fields modify the properties of the state object but I'm not sure how I can modify the data I have fetched. How do I keep the view state updated?</p>
  
  <pre><code>import React, {Component} from 'react';
  import gql from 'graphql-tag';
  import { graphql } from 'react-apollo';
  
  class EditContact extends Component {
    _update() {
      // Mutation call
    }
  
    render() {
      if(this.props.contactQuery &amp;&amp; this.props.contactQuery.loading) {
        return &lt;div&gt;Loading&lt;/div&gt;
      }
      if(this.props.contactQuery &amp;&amp; this.props.contactQuery.error) {
        return &lt;div&gt;Error&lt;/div&gt;
      }
      const contact = this.props.contactQuery.contact;
  
      return(
        &lt;div className="contact"&gt;
          &lt;input type="text" defaultValue={contact.firstName} onChange={??} /&gt;
          &lt;input type="submit" value="Save" onClick={this._update}&gt;
        &lt;/div&gt;)
    }
  }
  
  const CONTACT_QUERY = gql`
    query contactQuery($id: Int!) {
      contact(id: $id) {
        id
        firstName
        lastName
      }
    }
    `
  
  export default graphql(CONTACT_QUERY, {
    name: 'contactQuery',
    options: ownProps =&gt; ({ variables: { id: ownProps.match.params.id } })
  })(EditContact);
  </code></pre>
  
  <p>I know how to create and use the mutation itself but how do I keep track of the form changes and how do I set the initial data in the form fields?</p>