title: Variable value resets after useEffect
body: <p>I have something like this currently:</p>
  <pre><code>const Edit_History = (props) =&gt; {
    
      var thing = ''
    
      useEffect(() =&gt; {
        const id = props.match.params.id
          if (thing === '')
              axios.get(`http://localhost:3010/v0/student/${id}/${id}`)
              .then(({ data }) =&gt; {
                  thing = data
                  console.log(thing)
              })
      }, [])
  
      const submitHandler = async (e) =&gt; {
        console.log(thing)
        etc...
      }
  </code></pre>
  <p>When I first print out &quot;thing&quot; in useEffect, I get the value that I want. But when I try to print it on-submit with submit handler, it prints out an empty string, even though I don't modify the value of &quot;string&quot; outside of useEffect. I'm out of ideas on why this could be happening.</p>
  <p>edit:</p>
  <p>I originally tried using useState</p>
  <pre><code>const Edit_History = (props) =&gt; {
    
      const [thing, setThing] = useState(&quot;&quot;)
    
      useEffect(() =&gt; {
        const id = props.match.params.id
              axios.get(`http://localhost:3010/v0/student/${id}/${id}`)
              .then(({ data }) =&gt; {
                  setThing(data)
                  console.log(thing)
              })
      }, [])
  
      const submitHandler = async (e) =&gt; {
        console.log(thing)
        etc...
      }
  </code></pre>
  <p>but after setThing(data), thing is still undefined which was why I tried using var thing instead of useState.</p>