title: Reset useLazyQuery after called once
body: <p>I'm using <code>useLazyQuery</code> to trigger a query on a button click. After the query is called once, the results (data, error, etc) are passed to the component render on each render. This is problematic for example when the user enters new text input to change what caused the error: the error message keeps reapearing. So I would like to &quot;clear&quot; the query (eg. when user types new data into TextInput) so the query results return to there inital state (everything <code>undefined</code>) and the error message goes away.</p>
  <p>I can't find any clear way to do this in the Apollo docs, so how could I do that?</p>
  <p>(I though of putting the query in the parent component so it does not update on each rerender, but I'd rather not do that)</p>
  <p>This is how I have my component currently setup:</p>
  <pre><code>import { useLazyQuery } from 'react-apollo'
  
  // ...
  
  const [inputValue, setInputValue] = useState('')
  
  const [getUserIdFromToken, { called, loading, data, error }] = useLazyQuery(deliveryTokenQuery, {
    variables: {
      id: inputValue.toUpperCase(),
    },
  })
  
  useEffect(() =&gt; {
    if (data &amp;&amp; data.deliveryToken) {
      onSuccess({
        userId: data.deliveryToken.vytal_user_id,
        token: inputValue,
      })
    }
  }, [data, inputValue, onSuccess])
  
  // this is called on button tap
  const submitToken = async () =&gt; {
    Keyboard.dismiss()
    getUserIdFromToken()
  }
  
  // later in the render...
  
  &lt;TextInput
    onChangeText={(val) =&gt; {
      setInputValue(val)
      if (called) {
        // clean/reset query here?  &lt;----------------------
      }
    })
  /&gt;
  
  </code></pre>