ファイル添付処理にTypeScriptで型を指定する

  openAttachFileDialog(): void {
    const eleInput = document.getElementById('attach-file-input') as HTMLInputElement;
    if (eleInput) {
      try {
        eleInput.click();

        eleInput.addEventListener('change', (event: Event) => {
          const target = event.target as HTMLInputElement;
          const file = (target.files as FileList)[0];
          // 確認
          // console.log(file);

          const filereader = new FileReader();

          filereader.onload = () => {
            (document.getElementById('onDisplay') as HTMLInputElement).src =
              filereader.result as string;
          };
          filereader.readAsDataURL(file);
        });
      } catch (err) {
        // エラー時の処理
      }
    }
  }

<template>
   <input
     type="file"
     id="attach-file-input"
     name="attach-file"
     accept=".png, .jpeg, .jpg, .pdf"
     class="attach-file-input"
     @change="openAttachFileDialog($event)"
   />
   <!--下記イメージタグを置くと、プレビューが表示される -->
   <img id="onDisplay" src="" />
</template>