关于 Ant框架中 <a-upload> beforeUpload 获取图片的宽高以及返回false 还能上传的问题

简单粗暴直接上代码

      beforeUpload: function(file) {

        return new Promise((resolve, reject) => {
          const isJpgOrPng = file.type === 'image/jpeg'  //这里获取上传文件的类型
          if (!isJpgOrPng) {
            this.$message.warning('请上传jpg图片')
            return reject(false);  //如有问题那咱们通过reject 函数传一个false阻止他的上传
          }

          if (isJpgOrPng) {
            let reader = new FileReader(); //这个是通过原生的方式来获取图片的宽高
            reader.readAsDataURL(file);
            reader.onload = () => {
              const image = new Image();
              image.src = reader.result;
              image.onload = () => {
                let w = image.width;
                let h = image.height;
                if (w != 358 && h != 441) {
                  this.$message.warning('请上传358*441的图片')
                  return reject(false);  // //如有问题那咱们通过reject 函数传一个false阻止他的上传
                }else {
                  return resolve(true) //如没有问题了那咱们就通过resolve函数添加一个true 让文件上传
                }
              }
            }
          }
        });
      }

管哇嘎在这里插入图片描述
官网是这么说的 咱们也不懂反正按照规则来就行返回一个new Promise支持异步处理函数

着重注意一下resolve(上传使用的传递true)和reject(阻止上传的 传递false

  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值