美文网首页
iview 上传图片 限制图片比例

iview 上传图片 限制图片比例

作者: 他大舅啊 | 来源:发表于2019-08-01 18:19 被阅读0次
    // 上传图片限制  图片比例为 1 :1    3 : 2  
            checkImageWH(file) {
                let self = this;
                return new Promise(function (resolve, reject) {
                    let filereader = new FileReader();
                    filereader.onload = e => {
                        let src = e.target.result;
                        const image = new Image();
                        image.onload = function () {
                            if(this.width == this.height || self.GetPercent(this.width, this.height) == 1.5){
                                resolve();
                            }else{
                                self.$Notice.error({
                                    title: "请上传图片的尺寸比例为1:1 或者3:2",
                                });
                                reject();
                            }
                        };
                        image.onerror = reject;
                        image.src = src;
                    };
                    filereader.readAsDataURL(file);
                })
            },
    
            GetPercent(num, total) {
                num = parseFloat(num);
                    total = parseFloat(total);
                    if (isNaN(num) || isNaN(total)) {
                        return "-";
                }
                return total <= 0 ? "0%" : (Math.round(num / total * 100) / 100.00);
            } 
    

    使用

    //图片上传前
    detailBeforeUpload(file){
        return this.checkImageWH(file);
    },
    

    相关文章

      网友评论

          本文标题:iview 上传图片 限制图片比例

          本文链接:https://www.haomeiwen.com/subject/pficdctx.html