vue element 上传图片限制大小，before-upload不生效的问题

原因以及解决方法：

因为 before-upload 是指在文件上传之前、文件已被选中，但还没上传的时候触发，而设置了 :auto-upload=“false” 后，文件上传事件不被再次调用，所以 before-upload 不生效，所以，限制图片大小的时候，需绑定在 :on-change 里面

template：

<el-upload
  :limit="5"
  class="editpurchase_middle_avatar"
  action="#"
  :on-exceed="handleExceed"
  list-type="picture-card"
  :on-preview="handlePreview"
  :auto-upload="false"
  :on-remove="handleRemove"
  :file-list="fileList"
  :on-change="handChange"
  accept=".jpg,.jpeg,.png,.JPG,.JPEG,.PNG"
>
  <i
    style="z-index: 2020; display: block;"
    class="el-icon-plus editpurchase_middle_avatar-uploader-icon"
  ></i>
</el-upload>

methods绑定事件：

 handChange(file, fileList) {
 	// 使用文件名（file.name）的后缀名判断
     var testmsg = file.name.substring(file.name.lastIndexOf('.')+1)
     const extension1 = testmsg === 'jpg'
     const extension2 = testmsg === 'jpeg'
     const extension3 = testmsg === 'png'
     const extension4 = testmsg === 'JPG'
     const extension5 = testmsg === 'JPEG'
     const extension6 = testmsg === 'PNG'
     if(!extension1 && !extension2 && !extension3 && !extension4 && !extension5 && !extension6) {
        this.$message.error("上传图片只能是图片格式!");
        fileList.splice(-1,1); //移除选中图片
        return false;
      }
      const isLt2M = file.size / 1024 / 1024 < 2;
      if (!isLt2M) {
        this.$message.error('上传图片大小不能超过 2MB!');
        fileList.splice(-1,1); //移除选中图片
        return false;
      }
 }