$_FILES is empty when sending a POST request using axios in ReactJs

I have an array of Files that i want to retrieve in php along with some other string params, When i send the file(s) from the FormData in React they're being received as json in php :

 "{"dataForm":{"Files":[{"path":"aust.jpeg"}]},"headers":{"content-type":"multipart/form-data"}}"

I want to receive them in $_FILES instead for obvious reasons, is it possible to do that and read the rest of the params as json in php ? Also my php.ini is fully configured to allow file uploads

Here is the Reactjs code :

import axios from 'axios';

  const sendMail = (data, uploadedFiles) => {
  const dataForm = new FormData();
  dataForm['Files'] = uploadedFiles; // Here uploadedFiles is an array of files
  console.log(dataForm['Files'])
  axios.post('http://localhost/bickdata/mail/SendMail.php', {
    dataForm,
    headers: {
      'content-type': 'multipart/form-data'
  }
  }) .then(function (response) {
    console.log(response);
  });
}

Thanks in advance !

Solution 1:

Turns out axios.post() sends all the data as JSON by default which is why the files are not being interpreted as File objects in php, I did some minor changes with the post request and i finally received my files, here's the updated code :

(i'm only sending one file from the array for now, but i'm pretty sure it's the same procedure for an array of files)

  dataForm.append( 
    "potato", 
    uploadedFiles[0], 
    uploadedFiles[0].name 
  ); 

  axios({
    method: 'post',
    url: 'http://localhost/bickdata/mail/SendMail.php',
    data: dataForm,
    headers: {'Content-Type': 'multipart/form-data' }
    })
    .then(function (response) {
        //handle success
        console.log(response);
    })
    .catch(function (response) {
        //handle error
        console.log(response);
    });

Solution 2:

This is how you upload multiple files in React

const dataForm = new FormData();
uploadedFiles.map(file => 
    dataForm.append("Files[]", file);
}