Element upload 限制上傳圖片尺寸、大小、比例

<el-upload
           class="upload-demo"
           :action="uploadLi"
            :before-upload="beforeUpload"
            :on-success="handleSuccess"
            :headers="{'X-User-Token': authorization}"
             name="file"
             accept="image/png,image/jpg,image/jpeg,image/gif"
             :multiple=false
             :show-file-list=false
              >
              <div class="avatar" v-if="createForm.advertPic">
                   <img :src="createForm.advertPic" class="avatar_img">
                    <span>修改圖標</span>
              </div>
             <el-button size="small" type="primary" style="height:28px;" v-else>上傳</el-button>
              <div slot="tip" class="el-upload__tip" style="margin-top:0px;">只能上傳jpg/png/gif文件 750*1642px，1M以內</div>
 </el-upload>

 

js： 

handleAvatarSuccess(res, file) {
  console.log(res)
  console.log(file)
  this.imageUrl = URL.createObjectURL(file.raw);
  //
  if (res.code !== 200) {
    this.$message.error('上傳失敗！')
  } else {
    this.isShowRequest = false
    this.isLoad = false
    this.modalForm.logoId = res.body.fileId
    this.modalForm.logoPath = res.body.filePath
  }
},
beforeAvatarUpload(file) {
  console.log(file)
  const isJpgPng = file.type === 'image/jpeg' || file.type === 'image/png' || file.type === 'image/gif'

  if (!isJpgPng) {
    // this.$message.error('上傳文件格式只能是jpg/png')
    this.isLoad = true
    this.errText = '上傳文件格式只能是jpg/png/gif'
    // let _t = this
    // setTimeout(function () {
    //   _t.isLoad = false
    // },3000)
    return false
  }

  const isLt1M = file.size / 1024 / 1024 < 1
  if (!isLt1M) {
    // this.$message.error('上傳圖片大小不能超過 1MB!')
    this.isLoad = true
    this.errText = '上傳圖片大小不能超過 1MB!'
    // let _t = this
    // setTimeout(function(){
    //   _t.isLoad = false
    // },3000)
    return false
  }

  const isSize = new Promise(function(resolve, reject){
    // let width = 750;
    // let height = 1642;
    // let _URL = window.URL || window.webkitURL;
    let img = new Image();
    img.onload = function(){
      let valid = img.width / img.height === 1.67;
      valid ? resolve() : reject();
    }
    img.src = _URL.createObjectURL(file);
  }).then(()=>{
    return file;
  }, ()=>{
    // this.$message({
    //   message:'上傳圖片比例建議為5：3!請重新選擇!'
    // });
    this.isLoad = true
    this.errText = '上傳圖片比例只能為5:3, 請重新選擇上傳!'
    return Promise.reject()
    return false;//必須加上return false; 才能阻止
  })

  return isJpgPng && isLt1M && isSize
}