ファイルアップロードでファイルオブジェクトが送れない

環境情報

Nuxt.js:2.8
TypeScript:3.6.4

仕様

アップロードボタンを押すとOS(ブラウザ？）固有のファイル選択ダイアログが開いて選択するとアップロード処理へ飛ぶ

この仕様をformタグを使いファイルアップロードを実現したい

-サーバ側へファイルオブジェクトを渡したいのですが、うまくいってません。
-2種類のパターンでファイルオブジェクトを詰めようと試みていますが詰めれられていません。
1.forms.namedItemを使用
2.getElementByIdを使用

//HTMLは1、2ともに同じです
<form
      method="POST"
      action
      enctype="multipart/form-data"
      name="fileinfo"
      id="fileinfo"
    >
      <input
        id="upload_form"
        type="file"
        name="file"
        style="display:none"
        @change="upload"
      />
    </form>
    
//javascript
    //1
    const form = document.forms.namedItem('fileinfo')
    const files = new FormData(form)
    //2
    const form = document.getElementById('fileinfo')
    const files = new FormData(form)
   //それぞれのパターンで片方をコメントアウトしfilesを出力
   console.log('files')
   console.log(files)

2の場合

Argument of type 'HTMLElement' is not assignable to parameter of type 'HTMLFormElement'. Type 'HTMLElement' is missing the following properties from type 'HTMLFormElement': acceptCharset, action, autocomplete, elements, and 11 more.というエラーが出る。