上传图片及获取原始图片宽高
2019-07-09 本文已影响0人
Hsugar
- 上传的组件,略
- 上传图片组件的页面应用
<Avatar
:headPic="formData.headPicAddr"
size="800"
width="130"
height="130"
format="jpg,jpeg,png"
@uploaded="headUpload">
- 获取原始图片的尺寸并添加限制
在onload的方法中,image.width=this.naturalWidth
headUpload: function(url) {
let that = this,
image = new Image();
image.src = url;
if(url) that.$refs.formData.clearValidate('img');
that.formData.img = url;
console.log('headUpload=',url,'image',image)
image.onload=function(){
console.log('width==',image.width,this.naturalWidth,'height==',this.naturalHeight)
if(this.naturalWidth/this.naturalHeight!=2){
that.headImgStatus = false;
that.$message.warning('图片的宽高比例为2:1');
}
};
},