Предпросмотр картинок перед отправкой на сервер

setImgList(React.createElement('div',{},arrayImg))

 function onDropHandler(e) {
 
       e.preventDefault()
        let files =[...e.dataTransfer.files];
    let arrayImg=[];
 
      for (let i=0;i<files.length;i++) {
          console.log(i + '  ' + files[i])
          let reader = new FileReader();
          reader.readAsDataURL(files[i]);
          reader.onloadend = function () {
              arrayImg[i]=React.createElement('img',{src:reader.result},);
          }
          setImgList(React.createElement('div',{},arrayImg))
    console.log( arrayImg)
      }
 
}
 
 
return(<div>{imgList}</div>)

  setImgList(React.createElement('div',{},[
React.createElement('img',},),
React.createElement('img',{},)
]))

import React, { useState,useEffect } from 'react';
import "./DownloadFile.css"
function DownloadFile() {
   const [drag, setDrag]=useState(false)
    const [imgArray,setImgArray]=useState();
    const [imgList,setImgList]=useState();
   const [data,setData]=useState()
const [count,setCount]=useState(0);
 
   function buttonGreen(e){
      e.target.classList.toggle('buttonGreen')
 
   }
    function dragStartHandler(e) {
       e.preventDefault()
        setDrag(true);
    }
 
    function dragLeaveHandler(e) {
        e.preventDefault()
        setDrag(false);
    }
  function onDropHandler(e) {
 
       e.preventDefault()
        let files =[...e.dataTransfer.files];
    let arrayImg=[];
 
      for (let i=0;i<files.length;i++) {
          console.log(i + '  ' + files[i])
          let reader = new FileReader();
          reader.readAsDataURL(files[i]);
          reader.onloadend = function () {
              arrayImg[i]=React.createElement('img',{src:reader.result},);
          }
          setImgList(React.createElement('div',{},arrayImg))
    console.log( arrayImg)
      }
      // setImgList(React.createElement('div', {},[arrayImg[0]]));
 // setImgList(React.createElement('div', {},arrayImg));
 
    }
 
 
 
async function sendData() {
    let formData = new FormData();
    for (let file of imgArray) {
        formData.append(file.name, file);
 
        let promise = await fetch('http://localhost:5000/uploadImg', {
            method: 'POST',
            body: formData
        });
    }
}
let list=[];
 
 
console.log(typeof list)
 
    return (
        <div>
            {list.push(imgList)}
 
            {
                drag
                ? <div
                        onDragStart={e=>dragStartHandler(e)}
                        onDragLeave={e=>dragLeaveHandler(e)}
                        onDragOver={e=>dragStartHandler(e)}
                        onDrop={e=>onDropHandler(e)}
                        className='drop-area'>Отпустите файл чтобы загрузить их </div>
                :<div
                    onDragStart={e=>dragStartHandler(e)}
                    onDragLeave={e=>dragLeaveHandler(e)}
                    onDragOver={e=>dragStartHandler(e)}
                    >Перетащите файл, чтобы загрузить их</div>
            }
 
            <input type='time' className='begin'/>-<input type='time' className='end'/>
            <br/>
            <textarea placeholder='Напишите об организации'/>
            <br/>
            <button onClick={sendData}>Отправить</button>
        </div>
    )
 
}
export default DownloadFile;