FormData sends null to my back even though I get a file when I use formData.get('file')

Hi I want to send a file to parse to my backend using Flask.
If I send the file using Postman it works correctly but when I try to send it through my React app it does not go through.

                     <div>
                        <label htmlFor="file" style={{marginBottom:'0.5rem', display:'block'}}>
                            Upload Resume
                        </label>
                        <input
                        className={styles.inputstyle}
                        type="file"
                        name="file"
                        onChange={handleFileChange}
                        style={{ marginBottom: '0.5rem' }}
                        />
                        <button onClick={handleFileChange}>send</button>
                    </div>

The handleFileChange method below:

    const handleFileChange = (e) => {
        let file = e.target.files[0]
        const formData = new FormData()
        formData.append('file', file)

        console.log(formData.get('file')) // prints the correct file
        
        axios.post('http://127.0.0.1:8000/user-file', {data: formData},
        {
            headers : {
            'Content-type': 'multipart/form-data',
            }
        }
        )
        .then((response) => {
            console.log(response.data)
        })
      };

I get an error in my backend:

BadRequestKeyError: 400 Bad Request: The browser (or proxy) sent a request that this server could not 
understand.
KeyError: 'file'

Did I forget something think in my request?
Axios version: 1.4.0

EDIT: Added backend code route

@app.route("/user-file", methods=["POST"])
def file_to_resume():
    test = request
    test = request.files['file'] # works with postman
    data = extract_text(test.filename)
    data_parsed = parse_resume(data)
    return jsonify(data_parsed), 200

>Solution :

Well, the issue is that you are sanding an object with a data key inside, but you sould just send formData itself, so chenge your code to be

const handleFileChange = (e) => {
  let file = e.target.files[0]
  const formData = new FormData()
  formData.append('file', file)
  axios.post('http://127.0.0.1:8000/user-file', formData, // Here is the change
    {
      headers: {
        'Content-type': 'multipart/form-data',
      }
    }
  ).then((response) => {
    console.log(response.data)
  })
};