input type file onchange上传文件的过程中，遇到同一个文件二次上传无效的问题。

Posted 2020-10-30 yangAL

不要采用删除当前input[type=file]这个节点，然后再重新创建dom这种方案，这样是不合理的。

解释如下：
input[type=file]使用的是onchange去做，onchange监听的为input的value值，只有再内容发生改变的时候去触发，而value在上传文件的时候保存的是文件的内容，你只需要在上传成功的回调里面，将当前input的value值置空即可。
event.target.value=‘‘;
getInputFile(event) {
if(event.target.files.length){
let formData = new FormData()
formData.append("file", event.target.files[0])
this.$http({
method: ‘post‘,
async: true,
crossDomain: true,
url:${this.api.uploadData.uploadUrl},
headers: {
"Cache-Control": "no-cache",
"Postman-Token": "19899c72-855a-49a1-494b-fe42b45d5d5e"
},
processData: false,
contentType: false,
cors: {
//all requests are expected to be cross-domain requests
expected: true,
//if you want cookies to be sent along with the request
sendCredentials: true
},
mimeType: "multipart/form-data",
data:formData
}).then(res => {
if(!res.data.data.errTotal){
this.curMask = true
this.uploadSuccess = true
this.uploadFail = false
}else{
this.curMask = true
this.uploadFail = true
this.uploadSuccess = false
this.errNumber = res.data.data.errTotal
this.errUrl = res.data.data.errUrl
}
event.target.value=‘‘
}).catch(e => {
event.target.value=‘‘
this.$alert(e.response.data.msg)
})
}
}