[JavaScript] InputFile로 파일 업로드 후 초기화 방법

맹주완·2024년 1월 29일

JavaScript TypeScript

목록 보기
1/1

최근에 Power Apps에서 PCF 컴포넌트를 만들면서, 이 문제로 인해서 몇 일 시간을 쏟은 적이 있었다.


"다른 파일을 수행 할 때는 이벤트가 수행되는데, 이미 수행했던 파일을 수행 할 때는 왜 이벤트가 수행되지 않는거지?"


아무리 내 머리로는 이해가 될 수 없었다. 수행한 후에는 이벤트가 메모리에 해제 되고, 자동으로 초기화 되었던 걸로 기억을 하는데..

(WinForm에서 읽고 쓰고 할 때 그랬던 걸로 기억해)

text




그래서 무슨 문제인지 알 수가 없어서 FrontEnd 하는 친구에게 물어보니 아주 간단하게 해결이 되었다.

바로 파일 수행 후 "초기화"를 해주면 되었다.

🧨기존 작성된 소스코드

$("fileUploader").change(function(evt){

	  const input = document.getElementById('fileUploader') as HTMLInputElement;
      var reader = new FileReader();
      
      
      (기능수행)
}

🧨초기화 소스코드 추가

$("fileUploader").change(function(evt){

	  const input = document.getElementById('fileUploader') as HTMLInputElement;
      var reader = new FileReader();
      
      
      (기능수행)
      //Input 버퍼 초기화
      input.value = '';
}

요즘은 JQuery를 많이 사용하지 않는 추세라고는 하지만, 이번건 다른 분이 하시던 걸 이어 받아서 하다 보니까 사용 할 수 밖에 없었다.
추후 수정 할 때는 JQuery를 걷어내고 한번 해봐야 되겠다.

profile
코드도 디버깅~ 내 인생도 디버깅~

0개의 댓글