码迷,mamicode.com
首页 > Web开发 > 详细

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

时间:2018-04-12 18:06:21      阅读:246      评论:0      收藏:0      [点我收藏+]

标签:loaddata   token   AC   cookie   val   ssd   targe   files   header   

不要采用删除当前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)
})
}
}

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

标签:loaddata   token   AC   cookie   val   ssd   targe   files   header   

原文地址:https://www.cnblogs.com/yangAL/p/8809054.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!