上传图片规定尺寸大小
<div class="clearfix">
<input type="text" class="lng4" style="width:300px;float:left;height: 30px;margin-right: 10px;" v-model="imgName2" disabled >
<el-upload class="avatar-uploader" action="https://websit.tolandhealth.cn" :show-file-list="false" :on-success="handleAvatarSuccess2" :before-upload="beforeAvatarUpload" style="float:left;">
<el-button slot="trigger" size="small" type="primary">上传</el-button>
</el-upload>
</div>
<p>(注:封面图片,可以使用JPG或GIF格式,尺寸为宽:824px,高:1122px)</p>
imgName2:'',
imgUrl2:'',
file2:'',
handleAvatarSuccess2(res, file) {
this.imgName2=file.name
console.log('handleAvatarSuccess', file)
this.file2=file.raw
this.imgUrl2 = URL.createObjectURL(file.raw);
this.details.bcoverUrl=URL.createObjectURL(file.raw)
},
beforeAvatarUpload(file) {
const isLt2M = file.size / 1024 / 1024 < 1200;
if (!isLt2M) {
this.$message.error('上传头像图片大小不能超过 2MB!');
return false
}
console.log('file',file)
return this.checkImageWH(file, 824, 1122);
},
// 配置图片像素
checkImageWH(file, width, height) {
let self = this;
return new Promise(function (resolve, reject) {
let filereader = new FileReader();
filereader.onload = (e) => {
let src = e.target.result;
const image = new Image();
image.onload = function () {
if (width && this.width != width) {
self.$message.warning(
"请上传宽为等于" + width + "像素的图片"
);
reject();
} else if (height && this.height != height) {
self.$message.warning(
"请上传高度等于" + height + "像素的图片"
);
reject();
} else {
resolve();
}
};
image.onerror = reject;
image.src = src;
};
filereader.readAsDataURL(file);
});
},