More apps code
import React, { useRef } from 'react';
function ImageEditor() {
const canvasRef = useRef(null);
const handleFileChange = (e) => {
const file = e.target.files[0];
const reader = new FileReader();
reader.onload = () => {
const img = new Image();
img.src = reader.result;
img.onload = () => {
const canvas = canvasRef.current;
const ctx = canvas.getContext('2d');
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img, 0, 0);
};
};
reader.readAsDataURL(file);
};
return (
<div>
<input type="file" accept="image/*" onChange={handleFileChange} />
<canvas ref={canvasRef} style={{ border: '1px solid black' }}></canvas>
</div>
);
}
export default ImageEditor;
Comments
Post a Comment