作者:陈浩颖美娇承湖_527 | 来源:互联网 | 2022-01-25 05:52
使用 iview Upload 上传组件 手动上传 包括单个文件和多个文件
思路:创建一个数组 把需要上传的文件 push到这个数组里面
1.引用组件
2.手动上传,根据官方文档 设置:before-upload ="handleUpload"等于false
(1).:before-upload 是 iview Upload 上传组件的一个属性 设置返回值为 false 可以阻止默认上传方式(自动上传模式)
(2).handleUpload 是方法 *备注:代码在最后面
3.上传方法
//创建 formData 对象
let formData = new FormData();
//向 formData 对象中添加文件--这是其他参数
formData.append('jsid', _jsid);
//多个文件上传----------重点----需要吧已经存储到本地的文件加入 formData所以这里用for循环
for(var i=0; i
HTML代码如下:
已经提交数据-正在等待审核
请上传文件
JS代码
delFileList(index){
let that = this;
that.file.splice(index, 1);
console.log(that.file);
}
handleUpload (file) {
let that = this;
if(that.file.length >= 5){
this.$Message.info("最多只能上传5个文件");
}else{
that.file.push(file);
}
return false;
}
axios提交方法代码:
upload(){
let that = this;
let _jsid = that.$route.query.id;
if(that.file.length > 0){
that.loading2 = true;
//创建 formData 对象
let formData = new FormData();
//向 formData 对象中添加文件
formData.append('jsid', _jsid);
//多个文件上传
for(var i=0; i
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。