上传图片及获取原始图片宽高

  • 上传的组件,略
  • 上传图片组件的页面应用
<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');
      }
    };
  },
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容