使用input标签上传文件，限制图片尺寸

最近在项目中做了一个图库管理的功能，用来上传设备图片，但是在上传的时候没有判断图片的尺寸，导致上传图片大小不统一

input标签上设置上传类型与格式绑定change方法

<input style="visibility: hidden;" accept="image/png" type="file" name="pic" ref="imgInput" @change="saveSrc()" />

上传方法中的代码如下：

saveSrc(e) {
      let file = this.$refs.imgInput.files[0]
      if (file === undefined) {
          this.$message.error('请选择新图片');
          return;
      }
      else {
        let url = window.URL || window.webkitURL;
        let img = new Image();             
        img.src = url.createObjectURL(file);
        var that = this;
        img.onload = function () {       
            console.log('height:'+this.height+'----width:'+this.width)
            if (this.width > 200 || this.height > 200) {
              that.$message.error('上传图片尺寸过大');
              that.$refs.imgInput.value = "";
              return;
            } else {
              const formData = new FormData()
                formData.append('file',file)
                  let config = {
                    headers: {'Content-Type':'multipart/form-data'}
                  }
                  const loading = that.$loading({
                      text: '操作中',
                      spinner: 'el-icon-loading',
                      background: 'rgba(0, 0, 0, 0.7)'
                  });
                  var oReq = new XMLHttpRequest();
                  if(that.picNum == 1){
                    that.piclog = 'ztt';
                  } else {
                    that.piclog = 'jkms';
                  }
                  oReq.open("POST", `${GLOBAL.HOME}/api/Picturestorage/InsertPic?code=${that.form2.EqTypeCode}&group=${that.picNum}&pictureType=${that.piclog}`, true);
                  oReq.onload = (oEvent) =>{
                    if (oReq.status == 200) {
                      if(JSON.parse(oEvent.currentTarget.response).Code == 200){
                        that.$message({type: 'success',message: '保存成功!'});
                        that.GetPictureList();
                        that.dialogTableVisible = false;
                        loading.close();
                      } else {
                        that.$message.error(JSON.parse(oEvent.currentTarget.response).Message);
                        loading.close();
                      }
                    } else {
                      that.$message.error('保存失败');
                      loading.close();
                    }
                  }
                  oReq.send(formData);
                  that.$refs.imgInput.value = "";
            }
        }
      }
    },

在获取到所上传图片的宽高后，无法调用提示框，检查之后发现是因为this指向的问题，将全局的this使用变量保存即可