vue js获取上传图片的宽高

在项目里面碰到了一个上传图片需要上传图片的宽高的功能
html代码如下：在这里插入 <label style="position:relative;display:inline-block;width:1.7349rem;height:1.3rem;" for="cat"> <img src="@/img/message/logodefault.png" alt id="portrait1" style="width: 1.7349rem;height: 1.3rem" v-if="classImageshow" /> <z-image :image="createImage" style="width: 100%;height:100%" v-if="classImageshow==false?true:false" /> <input type="file" id="cat" ref="file2" accept="image/*" name="iconFile" @change="changeImageL" /> </label>代码片
js功能代码如下changeImageL(event) { this.classImageshow = false; console.log(this.$refs.file2.files); let that = this; let img; let file1 = event.target.files[0]; let fileReader = new FileReader(); fileReader.readAsDataURL(file1); //根据图片路径读取图片 fileReader.onload = function(e) { let base64 = this.result; img = new Image(); img.src = base64; img.onload = function() { that.imgInfo = { width: img.naturalWidth, height: img.naturalHeight }; console.log("宽：" + img.naturalWidth + " 高：" + img.naturalHeight); } } }