因項(xiàng)目需要,上傳圖片前要驗(yàn)證圖片的高寬,看了一下官方文檔,before-upload可以返回false或者Promise,就通過promise實(shí)現(xiàn)了這個功能
js部分
原文地址?iview 上傳圖片寬高限制
detailBeforeUpload(file) { return this.checkImageWH(file, 706, 397); }?
//checkImageWH 返回一個promise 檢測通過返回resolve 失敗返回reject組織圖片上傳
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.$Notice.error({
title:'請上傳寬為' + width +"的圖片",
? ? ? ? ? ? ? ? ? ? });
? ? ? ? ? ? ? ? ? ? reject();
? ? ? ? ? ? ? ? }else if (height &&this.height != height) {
self.$Notice.error({
title:'請上傳高為' + height +"的圖片",
? ? ? ? ? ? ? ? ? ? });
? ? ? ? ? ? ? ? ? ? reject();
? ? ? ? ? ? ? ? }else {
resolve();
? ? ? ? ? ? ? ? }
};
? ? ? ? ? ? image.onerror = reject;
? ? ? ? ? ? image.src = src;
? ? ? ? };
? ? ? ? filereader.readAsDataURL(file);
? ? });
},
