//上传前
beforeUpload(file) {
const isJpgOrPng =
file.type === "image/jpeg" || file.type === "image/png";
if (!isJpgOrPng) {
this.$message.error("暂不支持此文件类型!");
}
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isLt2M) {
this.$message.error("图片大小不超过2MB!");
}
return isJpgOrPng && isLt2M && this.isSize(file, 180, 64);
},
// 判断尺寸
isSize(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) ||
(height && this.height != height)
) {
self.$message.error(
"请上传按" + width + "*" + height + "等比缩放的图片"
);
reject();
} else {
resolve();
}
};
image.onerror = reject;
image.src = src;
};
filereader.readAsDataURL(file);
});
},
【vue】ant图片上传前校验图片宽高（直接复用）
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
- 文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
推荐阅读更多精彩内容
- 最近在做一个图片列表的需求，要求选择图片之后，自动上传到阿里云服务器，然后动态展示。由于图片列表要求有预览，编辑，...
- 前言：该解决方案只支持IE10及以上，目前来看IE9及以下所占的份额越来越小了，如果在项目不需要考虑IE9及以下的...
- 作者是在vue上做的开发，可能对有学过vue学者比较友好 首先，我们看看整个执行过程的类型转换 input -->...
