elementUI上传图片前判断图片的尺寸大小

Posted 2021-01-21 yuzihong

　　在上传图片前判断尺寸的大小，遇到了好多的坑。

1.没有注意到onload是异步加载，所以一定要在onload后在执行判断图片尺寸

2.upload内部需要一个promise,简单的return出false并没有什么用

3.完整代码：

beforeAvatarUpload(file) {
   
    const isSize = new Promise(function(resolve, reject) {
        let width = 100;
        let height = 100;
        let _URL = window.URL || window.webkitURL;         
        let img = new Image();
        img.onload = function() {
            let valid = img.width >= width && img.height >= height;
            valid ? resolve() : reject();
        }
        img.src = _URL.createObjectURL(file);
    }).then(() => {
        return file;
    }, () => {
        this.$message.error(‘上传的icon必须是等于或大于100*100!‘);
        return Promise.reject();
    });
    return  isSize;
}