element-ui中el-upload在ie10中无法上传相同图片的问题:XMLHttpRequest: 网络错误 0x2efd, 由于出现错误 00002efd 而导致此项操作无法完成。
最近用elment-ui做了一个项目,在ie10上传图片的时候,第一次没问题,然后上传同样的图片,就会报错XMLHttpRequest: 网络错误 0x2efd, 由于出现错误 00002efd 而导致此项操作无法完成。简单说下问题分析,很多说是keepAlive机制造成的,于是关闭和后端联调,关闭keep-Alive,并没有卵用.这个问题本质上是vue中onchange上传相同图片的问题...
·
最近用elment-ui做了一个项目,在ie10上传图片的时候,第一次没问题,然后上传同样的图片,就会报错XMLHttpRequest: 网络错误 0x2efd, 由于出现错误 00002efd 而导致此项操作无法完成。
简单说下问题分析,很多说是keepAlive机制造成的,于是关闭和后端联调,关闭keep-Alive,并没有卵用.
这个问题本质上是vue中onchange上传相同图片的问题,上传相同图片不会onchange,一般的解决办法就是讲input的value置空。
但是ie10及以下无法置空。
下面直接说我的解决办法吧。
<el-upload
ref="upload"
class="pic-uploader"
:action="action"
:show-file-list="false"
accept="image/jpg, image/jpeg, image/png"
:before-upload="onBeforeUpload"
:on-success="handleSucess"
:on-error="handleError"
>
<i v-if="!imageUrl" class="el-icon-plus pic-uploader-icon"></i>
</el-upload>
在handleSucess回调里判断ie10
//上传图片成功回调
handleSucess() {
let isIE10 = false;
if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
// 判断ie10以及以下
isIE10 = true;
} else {
isIE10 = false;
}
let ele = this.$refs.upload.$el.getElementsByTagName("input")[0];
if (isIE10) {
let form = document.createElement("form");
let beforInput = ele.nextSibling;
let parentInput = ele.parentNode;
form.appendChild(ele);
form.reset();
parentInput.insertBefore(ele, beforInput);
} else {
ele.value = null;
}
},
其实总的来说就是ie没办法用value=null清理,只能建立父元素form进行重置。
更多推荐
已为社区贡献3条内容
所有评论(0)