How to upload and play an audio file using input tag in Reactjs

I want to upload an audio file in reactjs using input tag, but my code doesn't seem to work.

Here, is my code:

function App() {

  const[ fileName, setFileName ] = useState(null)
  const [isUploaded,setIsUploaded] = useState(false)  
    const onFileChange =(e) =>{
       
        setFileName(e.target.files[0])
    }

    
  
    const onFileUpload = async() => {
        
        const formData = new FormData()

        await formData.append(
            "myFile",
            fileName,
            fileName.name
        )

        console.log(fileName)
        
        
        setIsUploaded(true)
    }
 

  return (
    <div>

  <Route exact path="/" render={() => (
    isUploaded ? (
      <EditScreen fileName={fileName} />
    ) : (
        <div>
            <input className="inputFile" type="file" accept="audio/*" name="file" onChange={onFileChange} />
            <button type="submit" onClick={onFileUpload}>Upload!</button>
        </div>
    )
  )}/>
      
   </div>
  );
}

export default App;

Could you guys tell me what's wrong with this or suggest some other approach to achieve the same?