iview upload 上传图片前判断高宽

  • 2018-07-13
  • 0
  • 0

因项目要求,图片上传前需要获取宽高,判断上传的图片是否符合分辨率,话不多说,直接上代码
– test.vue html

<Upload action="https://bbs.okii.com/api/common/uploadFile"
        :format="['jpg','png']"
        :before-upload="beforeUpload"
        :on-progress="onUpload"
        :on-success="onSuccess">
        <Button type="ghost" icon="ios-cloud-upload-outline">上传750*324像素的图片</Button>
</Upload>
  • test.vue js
beforeUpload(file) {
    // let vm = this;
    let fr = new FileReader();
    fr.onload = e => {
        let src = e.target.result;
        const image = new Image();
        image.onload = function() {
            console.log(this.width);  
            console.log(this.height); //这里获取到宽、高了,接下来就做判断,然后不符合要求就返回false阻止上传
        };
        image.src = src;
    };
    fr.readAsDataURL(file);
    console.log(file);
}

评论

还没有任何评论,你来说两句吧