在React中使用input标签上传文件
<input onChange={ this.onChangeFiles } type="file" name="uploadfile" />
当使用onChange事件时,发现两次选择同一文件会不起作用。
解决方案:
使用ref获取当前input,每次选择后把valu清空
<input onChange={ this.onChangeFiles } type="file" ref={ (input) => { this.uploadInput = input; } } name="uploadfile" />
然后在onChange事件里把value置空
onChange () {
将files对象转化为数组
const files = [].slice.call(e.target.files);
...
this.uploadInput = "";
}
Input上传多个文件 multiple属性
<input type="file" name="" multiple="" />
Input上传文件夹 webkitdirectory属性
<input type="file" name="" multiple="" webkitdirectory="" />