在使用type类型为file
的input来上传文件时,发现连续上传同一个文件,第二次以后就不会再触发onChange事件,原因是onChange事件触发的条件为其value发生变化
,上传文件时,该input的value值为文件在磁盘中的位置。知道了触发条件以后,我们就可对症下药:改变value值即可
。
方法1
在input元素中添加onClick事件,点击时将其value置空即可。
<input
type='file'
accept='.xlsx, .xls'
onClick={(event)=> { event.target.value = null }}
onChange ={this.onImportExcel}
/>
方法2
其实也一样,就是获取该元素,将其值在合适的地方将其置为空即可。
<input
id='file'
type='file'
accept='.xlsx, .xls'
onChange={this.onImportExcel}
/>
//在合适的地方设置其值为null
document.getElementById('file').value = null;