title: ReactJS simple image upload buffer displays null
body: <p>Inside a component, I have an input field for an image like so:</p>
  <pre><code>function AFunction () {
  
      const [imageTitle, setImageTitle] = useState(&quot;&quot;)
      const [buffer, setBuffer] = useState(null)
  
      // for file (does not work)
      &lt;input type='file' accept=&quot;.png, .jpg, .jpeg&quot; onChange={(event) =&gt; {
                      event.preventDefault()
                      const file = event.target.files[0]
                      const reader = new window.FileReader()
                      reader.readAsArrayBuffer(file)
                  
                      reader.onloadend = () =&gt; {
                          setBuffer(Buffer(reader.result))
                          console.log('buffer', buffer)
                      }
      }} /&gt;
  
      // for title (works)
      &lt;input id=&quot;imageTitle&quot; type=&quot;text&quot; value={imageTitle} onChange={e =&gt; setImageTitle(e.target.value)} /&gt;
  
  }
  </code></pre>
  <p>This code gets the title correctly, but displays the buffer as <code>null</code></p>
  <p>Full behaviour:</p>
  <ol>
  <li>Upload image from file...</li>
  <li>Image gets uploaded</li>
  <li>console.log displays <code>null</code></li>
  <li>further debugging proves title is known after a change in input field</li>
  </ol>
  <p>I tried altering the <code>useState</code> parameter with <code>&quot;&quot;</code>, also does not work.</p>