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

Popular posts from this blog

Games Journal