Cropper实现图片的剪切上传

var canvas = this.cropper.getCroppedCanvas({});
				this.imgsrc = canvas.toDataURL();
                // function downLoad(url){
                //     var oA = document.createElement("a");
                //     oA.download = '';// 设置下载的文件名,默认是'下载'
                //     oA.href = url;
                //     document.body.appendChild(oA);
                //     oA.click();
                //     oA.remove(); // 下载之后把创建的元素删除
                // }
                // downLoad(this.imgsrc)
			
				canvas.toBlob((blob)=>{
	                let param = new FormData();
	                param.append('file', blob,"a.png");
	                this.loadingshow = true;
					//config.api.UPLOAD.HANDLE
	                this.$http.post(config.api.UPLOAD.HANDLE,param).then(data=>{
	                	console.info(data)
	                   if(data.data.code=="001"){
	                    this.$Message.info('上传成功');
	                    this.loadingshow = false;
	                    if(this.cropper){
		                    this.cropper.destroy();
							this.cropper = null;
	                    }
	                   }else{
	                       this.$Message.info('上传失败');
	                       this.loadingshow = false;
	                   }
	                })
	            },'image/jpeg')

			},
  • 1.图片剪切完成以后图片变大,在方法中增加参数 “image/jpeg”
  • 2.实现formdata,指定文件名的方式 param.append(‘file’, blob,“a.png”);
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值