이미지 파일 선택하여 Preview 출력

function Home() {
  const [attachment, setAttachment] = useState();

  const handleAddPhoto = (event) => {
    console.log("handleAddPhoto");
    const {
      target: { files },
    } = event;
    const theFile = files[0];
    const reader = new FileReader();
    reader.onloadend = (finishedEvent) => {
      const {
        currentTarget: { result },
      } = finishedEvent;
      setAttachment(result);
    };
    reader.readAsDataURL(theFile);
  };

  return (
    <div>
      {attachment && (
        <div>
          <img src={attachment} width="200px" height="200px" />
        </div>
      )}
      <input
        type="file"
        name="imageFile"
        accept="image/*"
        onChange={handleAddPhoto}
      />
    </div>
  );
}