vue ElementUI upload上傳檔案時對檔案格式、大小和寬高的限制

邢闖洋發表於2022-02-09
beforeAvatarUpload(file) {
    const isJPG = file.type === 'image/jpg';
    const isPNG = file.type === 'image/png';
    const isLt20M = file.size / 1024 / 1024 < 20;
    if (!isJPG) {
        this.$message.error('上傳圖片的格式只能是 JPG或PNG 格式!');
    }
    if (!isPNG) {
        this.$message.error('上傳圖片的格式只能是 JPG或PNG 格式!');
    }
    if (!isLt20M) {
        this.$message.error('上傳圖片的大小不能超過 20M!');
    }
    const isSize = new Promise(function(resolve, reject) {
        let width = 320;
        let height = 320;
        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('上傳的圖片寬高必須是320*320!');
        return Promise.reject();
    });
    return isPNG && isJPG && isSize && isLt20M;
}

原文連結

vue ElementUI upload上傳檔案時對檔案格式、大小和寬高的限制

本作品採用《CC 協議》,轉載必須註明作者和本文連結

相關文章