문제인식

리액트에서 input으로 파일 입력을 받을때 onChange를 이용하여 어떤 작업을 수행하도록 하였다.
그런데, 이후에 input에 같은 파일을 입력받으면 onChange가 발동되지 않아서 이벤트 핸들러가 작동하지 않았다.

해결방법

클릭하는 순간 기존 파일 연결을 끊어버리면 된다.

<input id="upload" ref="upload" type="file" accept="image/*"
  onChange={(event)=> { 
    this.readFile(event) 
  }}
  onClick={(event)=> { 
    event.target.value = null
  }}
/>