如何解决裁剪的图像小于裁剪的图像React.js + react-image-crop
我正在尝试在我的React.JS项目中实现react-image-crop
。我有一个小问题:裁切后的图片与裁切后的尺寸不一样。.我在<ReactCrop>
组件上使用以下功能:
handleImageLoaded = (image) => {
//
};
handleOnCropChange = (percentCrop) => {
this.setState({ crop: percentCrop });
};
handleOnCropComplete = (percentCrop) => {
if (this.imageRef && percentCrop.width && percentCrop.height) {
const canvasRef = this.imagePreviewCanvasRef.current;
const { imgSrc } = this.state;
image64toCanvasRef(canvasRef,imgSrc,percentCrop);
}
};
这是我的image64toCanvasRef
函数:
export function image64toCanvasRef(canvasRef,image64,percentCrop) {
const canvas = canvasRef; // document.createElement('canvas');
canvas.width = percentCrop.width;
canvas.height = percentCrop.height;
const ctx = canvas.getContext('2d');
const image = new Image();
image.src = image64;
image.onload = function () {
ctx.drawImage(
image,percentCrop.x,percentCrop.y,percentCrop.width,percentCrop.height,percentCrop.height
);
};
}
所以我的猜测是问题出在ctx.drawImage()
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。