//结构
<img :src="imgLogo" class="logoImg fl" style="margin:0 10px;" />
<el-upload style="width: 220px" ref="newupload" class="logo-uploader fl" action="#" :show-file-list="false" :before-upload="beforeLogoImgUpload" :http-request="httpRequestLogo">
<el-button slot="trigger" size="small" icon="el-icon-upload" style="width: 115px;">选择Logo
</el-button>
<div slot="tip" class="el-upload__tip">
<p>只能上传jpg/png/gif文件，且不超过2MB</p>
<p>建议上传图片尺寸为80*60</p>
</div>
</el-upload>
//方法
beforeLogoImgUpload(file) {
const isJPG =
file.type == "image/jpeg" || file.type == "image/png" || file.type == "image/gif";
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isJPG) {
this.$message.error("上传企业Logo图片只能是 JPG/PNG/GIF 格式!");
return isJPG;
}
if (!isLt2M) {
this.$message.error("上传企业Logo图片大小不能超过 2MB!");
return isLt2M;
}
this.multfileLogoImg = file;
return isJPG && isLt2M;
},
httpRequestLogo(data) {
let _this = this;
let rd = new FileReader(); // 创建文件读取对象
this.logoFile = data.file; //传递给后端的参数
rd.readAsDataURL(this.logoFile); // 文件读取装换为base64类型
rd.onloadend = function(e) {
_this.imgLogo = rd.result; // 图片回显
_this.fd = new FormData();
_this.fd.append("token", _this.token); //传其他参数
_this.fd.append("file", _this.logoFile); //传其他参数
api_bcs.saveFileUrl(_this.fd).then(res => {
if (res) {
_this.delLogoList.push(res.data);
_this.imgLogoParm = res.data;
_this.$message({ showClose: true, type: "success", message: "设置成功" });
store.commit("UPDATE_SYSHEADER", _this.imgLogo); //企业logo
}
});
};
},
el-upload--》 当action为空时，如何实现上传功能？