解决input type=file 同一个文件二次上传无效的问题

在做上传文件的时候,大家会引入input标签。但在实现的过程中,在上传一个文件后,第二次上传同一个文件时会无法触发上传的代码,问题其实这样解决。

代码例子

html:

<input accept='image/*' type='file' @change="uploadPic($event)" style="display: none;" id='select-pic'>

javascript:

uploadPic(e) {
                //e.target.value文件名
                var file = e.target.files[0];
                console.log('正在上传...')
                this.doPicUpload(file);
                e.target.value='';
            },

关键句

实现功能的关键在于最后一句:

e.target.value='';

因为触发条件为change,当input里储存的文件没有变化的时候是不会进入函数的,所以在上传的最后,把input中的value值清空就好了。

推荐阅读更多精彩内容