如何使用onsubmit操作重现表单操作？

Question

假设我们有下一个表格：

<form ref='uploadForm' 
  id='uploadForm' 
  action='http://localhost:3001/upload' 
  method='post' 
  encType="multipart/form-data">
    <input type="file" name="image" />
    <input type="text" name="name" placeholder="name"/>
    <input type='submit' value='Upload!' />
</form>

我们可以通过在提交时运行一个函数来轻松重现名称，该函数读取输入的值，并将其传递给正文，如下所示：

onSubmit = () => {
  const name = document.getElementById("name").value;
  fetch(".../upload", {
  method: 'post',
  headers: {'Content-Type': 'application/json'},
  body: JSON.stringify({
      name
  })
}

<input type="file" name="image" id="file"/>
<input type="text" name="name" placeholder="name" id="name"/>
<input type='submit' value='Upload!' onClick={onSubmit()}/>

但是文件呢？如何将文件传递给请求？