input type="file" 동일한 파일 재업로드시 이벤트 작동하지 않는 이슈

혜진 조·2024년 1월 22일
0

자바스크립트

목록 보기
11/12

input type="file"에서 onChange는 실질적인 데이터가 바뀔때만 반응하기때문에 동일한 파일을 다시 업로드할 때는 이벤트가 작동하지 않아 value를 reset 해줄 필요가 있다.

 const handleFileReader = async (e: ChangeEvent<HTMLInputElement>) => {
    if (e.target.files) {
      if (submitRef) {
        submitRef?.current?.click();
      }
      e.target.value = ""; //동일한 파일을 재선택해도 이벤트가 작동하도록
    }
  };
  
  
  
  
         
             <input
                type="file"
                accept="image/jpg,image/png,image/jpeg,image/gif"
                onChange={handleFileReader}   
                ref={fileInput}
              />
profile
나를 믿고 한 걸음 한 걸음 내딛기! 🍏

0개의 댓글