Antd Upload上传组件限制上传图片的宽高-码农资源网

正文概述

beforeUpload: file => {
	  this.handleFilebeforeUpload(file)
	     .then(() => {
	       message.success(`上传成功`);
	     })
	     .catch(() => {
	       Modal.error({
	         title: "上传图片的宽高不符合要求，请重传！（宽高不得超过1500）"
	       });
	     });
 },

handleFilebeforeUpload = file => this.checkImageWH(file, 1500, 1500);

 // 上传图片尺寸限制
checkImageWH(file, width, height) { // 参数分别是上传的file，想要限制的宽，想要限制的高
    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 (this.width >= width && this.height >= height) { // 上传图片的宽高与传递过来的限制宽高作比较，超过限制则调用失败回调
            reject();
          } else {
            resolve();
          }
        };
        image.onerror = reject;
        image.src = src;
      };
      filereader.readAsDataURL(file);
    });
  }