vue+Element 或者vue+iView 上传图片验证分辨率

324 阅读1分钟

如果想在上传图片验证分辨率就放在before-upload这个钩子调用

image.png 具体方法 先定义:before-upload="beforeUpload" image.png

然后在methos调用这个方法

例如我这边设置的宽度不能大于或者小于980像素高度不能大于1180和小于1180像素

beforeUpload(file) {

   const _URL = window.URL || window.webkitURL

 const isSize = new Promise((resolve, reject) => {
            const img = new Image()
            img.onload = function() {
                this.width > 980 || this.width < 980 || this.height > 1180 || this.height < 1180 ? reject() : resolve()
            }
            img.src = _URL.createObjectURL(file)
        }).then(
            () => {
                return file
            },
            () => {
                this.$Message.error('上传失败:请上传尺寸为980*1180px的图片!')
                return Promise.reject()
            }
        )
        return isSize
    },
    
    

效果

image.png